@font-face { font-family: 'FontAwesome'; src: url('fonts/fontawesome-webfont.eot?v=4.7.0'); src: url('fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'),url('fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'),url('fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'),url('fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'),url('fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg'); font-weight: normal; font-style: normal } /* 在根元素上定义变量 */ :root { --primary-color: #2a79ff; } body { max-width: 100vw; } .carousel { position: relative; max-width: 70rem; margin: auto; overflow: hidden; } .carousel-images { display: flex; transition: transform 0.5s ease-in-out; } .carousel-images img { max-width: 100%; display: block; height: 31rem; } .carousel-controls { position: absolute; top: 50%; width: 100%; display: flex; justify-content: space-between; transform: translateY(-50%); } button { background-color: rgba(255, 255, 255, 0.7); border: none; cursor: pointer; font-size: 1.125rem; } .carousel-caption { position: absolute; color: #fff; text-align: center; z-index: 2; left: 0; right: 0; background: rgba(0, 0, 0, 0.3); padding: 0; bottom: 0; text-shadow: none; padding: 0.3125rem 0; } @media (max-width: 767px) { .hidden-xs { display: none !important; } } /*内容*/ .introduce_box { display: flex; align-items: flex-start; gap: 1rem; background: #fbfbfb; } .introduce_box_title { color: #2B2D33; /* width: 48rem; */ padding: 0.625rem; box-sizing: border-box; } .school_box_right { display: flex; flex-direction: column; justify-content: space-between; margin-top: 0.625rem; width: 20rem; text-align: left; padding: 0.625rem; box-sizing: border-box; } .title { display: flex; margin-bottom: 0.625rem; align-items: center; justify-content: space-between; } .title-l { font-size: 1.5rem; font-weight: bold; color: #333; position: relative; padding-left: 1.875rem; &::before, &::after { content: ''; position: absolute; width: 0.5rem; height: 0.5rem; background: #a0c6ff; top: 0.375rem; left: 0.75rem; } &::after { width: 0.75rem; height: 0.75rem; background: #2a79ff; left: 0; top: 0.875rem; } } .contents { padding-top: 0.3125rem; margin-left: -0.9375rem; } .content-items{ position: relative; cursor: pointer; padding: 0.9375rem; margin-bottom: 0.625rem; display: flex; cursor: pointer; transition: all 0.2s linear; border-radius: 0.125rem; } .content-item-l{ flex-shrink: 0; width: 13rem; height: 8.8rem; border-radius: 0.125rem; overflow: hidden; position: relative; } .content-item-l img{ width: 100%; height: 100%; object-fit: cover; transition: all 1s; &:hover{ transform: scale(1.12); } } .views-num{ padding-right: 0.3125rem; } .content-item-l .sort{ position: absolute; top: 0.625rem; left: 0.625rem; color: #fff; font-size: 0.75rem; padding: 0 0.5rem; line-height: 1.5rem; background: rgba(0, 0, 0, 0.6); border-radius: 0.125rem; } .shuang { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .content-item-r{ flex: 1; padding-left: 1.25rem; display: flex; flex-wrap: wrap; align-content: space-between; text-align: left; overflow: hidden; } .content-item-r-t{ color: #333; font-size: 1.25rem; font-weight: bold; width: 100%; line-height: 1.5rem; } .content-item-r-t a { color: #333; font-size: 1.25rem; font-weight: bold; display: block; &:hover{ color: #2a79ff; } } .content-item-r-m{ padding-top: 0.5rem; color: #666; font-size: 0.875rem; line-height: 1.5rem; height: 3.025rem; text-align: justify; width: 100%; font-weight: 400; } .content-item-r-b{ color: #999; font-size: 0.75rem; padding-top: 0; width: 100%; line-height: 1.5rem; font-weight: 400; } .content-item-r-labels{ padding-top: 0.125rem; display: flex; flex-wrap: wrap; width: 100%; align-items: center; gap: 1rem; color: #666; font-size: 0.8125rem; justify-content: space-between; } .content-item-r-labels span strong { color: #2a79ff; } .flx-gap { display: flex; gap: 1rem; } .content-item-r-label{ background: #F6F6F6; border-radius: 0.25rem; padding: 0.25rem 0.5rem; color: #666; font-size: 0.875rem; margin-right: 1.25rem; max-width: 6.75rem; font-weight: 400; line-height: 1.5rem; } .slider-title { padding-top: 0.625rem; color: #333; font-size: 1rem; font-weight: bold; border-top: 0.125rem solid #E5E5E5; position: relative; width: 100%; &::before{ content: ''; position: absolute; top: -0.125rem; left: 0; width: 5rem; height: 0.125rem; background-color: #2a79ff; } } .slider-content { padding-bottom: 2.5rem; } .slider-content{ padding-bottom: 2.5rem; } .slider-content-banner{ margin-top: 1.25rem; position: relative; height: 11.1875rem; border-radius: 0.125rem; overflow: hidden; cursor: pointer; } .slider-content-banner img{ width: 100%; height: 100%; object-fit: cover; border-radius: 0.125rem; } .slider-content-banner .sort{ line-height: 1rem; padding: 0 0.25rem; position: absolute; top: 0; left: 0; color: #fff; font-size: 0.75rem; min-width: 1rem; text-align: center; border-radius: 0.125rem 0 0.125rem 0; background: rgba(0, 0, 0, 0.6); &.top{ background: #2a79ff; } } .slider-content-banner-txt{ width: 100%; height: 4.5rem; position: absolute; bottom: 0; left: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 100%); padding: 3rem 0.625rem 0.625rem; color: #fff; font-size: 0.75rem; box-sizing: border-box; } .slider-content-banner-txt-t{ font-weight: bold; font-size: 0.875rem; } .slider-content-banner-txt-b{ padding-top: 0.3125rem; color: rgba(255, 255, 255, 0.8); } .slider-content-item{ margin-top: 1.25rem; display: flex; height: 4.375rem; border-radius: 0.125rem; overflow: hidden; box-sizing: content-box; cursor: pointer; } .slider-content-item-l{ position: relative; width: 6.5625rem; border-radius: 0.125rem; overflow: hidden; padding-right: 0.625rem; } .slider-content-item-l .sort{ line-height: 1rem; padding: 0 0.25rem; position: absolute; top: 0; left: 0; color: #fff; font-size: 0.75rem; min-width: 1rem; text-align: center; border-radius: 0.125rem 0 0.125rem 0; background: rgba(0, 0, 0, 0.6); &.top{ background: #2a79ff; } } .slider-content-items{ margin-top: 1.25rem; display: flex; /* height: 4.375rem; */ border-radius: 0.125rem; overflow: hidden; box-sizing: content-box; cursor: pointer; } .slider-content-item-r{ flex: 1; width: 100%; } .slider-content-item-r-t{ height: 2.5rem; line-height: 1.25rem; color: #333; font-size: 0.875rem; display: block; width: 99%; } .slider-content-item-ts{ padding: 0.625rem 0 0.3rem; border-top: 0.0625rem solid #f6f6f6; line-height: 1.25rem; color: #333; font-size: 0.875rem; display: block; width: 99%; } .slider-content-item-bs{ color: #999; font-size: 0.75rem; padding-top: 0; } .slider-content-item-r-b{ color: #999; font-size: 0.75rem; padding-top: 0.8125rem; } .hot-search{ display: flex; flex-wrap: wrap; padding-bottom: 3.5rem; } .label{ padding: 0.25rem 0.5rem; background: #F6F6F6; border-radius: 0.25rem; max-width: 8rem; font-size: 0.875rem; color: #666666; margin-top: 0.9375rem; margin-right: 0.9375rem; } .img{ width: 100%; height: 100%; object-fit: cover; } #page { min-height: 1.423rem; display: table; margin: 1.875rem auto 0; align-items: center; justify-content: center; } .page { text-align: center; } .fl { float: left; } .fr { float: right; } .pagingUl { float: right; padding: 0; margin: 0; list-style: none; height: 1.875rem; } .pagingUl li { float: left; width: 1.875rem; height: 1.875rem; background: #dfdfdf; text-align: center; margin-right: 0.9375rem; border-radius: 0.3125rem; } .pagingUl li a { display: inline-block; width: 1.875rem; height: 1.875rem; text-align: center; line-height: 1.8rem; color: #666; font-size: 0.75rem; border-radius: 0.3125rem; } .prv { margin-right: 0.625rem; } .first, .last { width: 1.875rem; height: 1.875rem; font-size: 0.75rem; text-align: center; line-height: 1.875rem; cursor: pointer; background: #dfdfdf; padding: 0 0.3125rem; border-radius: 0.3125rem; margin-right: 0.625rem; } .prv, .next { width: 1.875rem; height: 1.875rem; text-align: center; line-height: 1.75rem; cursor: pointer; background: #dfdfdf; padding: 0 0.3125rem;; border-radius: 0.3125rem; } .prv:hover, .next:hover, .first:hover, .last:hover, .pagingUl li a:hover, .activP { background-color: #2a79ff!important; color: #fff!important; } .layui-laypage span { display: inline-block; vertical-align: middle; padding: 0 0.9375rem; background-color: #fff; color: #333; font-size: 0.75rem; } /*文本超长省略*/ .dan { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis; -webkit-text-overflow: ellipsis; -moz-text-overflow: ellipsis; } .fa { display: inline-block; font: normal normal normal 14px / 1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .fa-thumbs-up:before { content: "\f164"; } .fa-comments:before { content: "\f086"; } .fa-eye:before { content: "\f06e"; } /* 详情 */ .detail-nav { padding: 1.25rem 0; font-size: 0.875rem; color: rgba(0, 0, 0, 0.45); } .detail-nav a { text-decoration: none; color: #303133; } .content-title .content-title-t { font-size: 1.5rem; font-weight: bold; color: #333; line-height: 2.0625rem; } .content-title .content-title-b { padding-top: 1.25rem; color: #999; font-size: 0.875rem; display: flex; justify-content: space-between; } .detail-content { padding: 2rem 0 2rem; color: #333; font-size: 1rem; line-height: 2rem; text-align: justify; } .detail-content p { line-height: 1.875rem; padding-bottom: 0.5rem; } .ewmText { font-size: 0.875rem; color: #666; padding-bottom: 0.5rem; } .alincenter{ text-align: center; } .detal-img{ padding: 0.625rem 0; width: 31.25rem; } .detal-rwm{ padding: 0.625rem 0; width: 12.5rem; } .social-share { font-family: "socialshare" !important; font-size: 1rem; font-style: normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: 0.2px; -moz-osx-font-smoothing: grayscale } .social-share .social-share-icon { position: relative; display: inline-block; width: 2rem; height: 2rem; font-size: 1.25rem; border-radius: 50%; line-height: 2rem; border: 0.125rem solid #666; color: #666; text-align: center; vertical-align: middle; transition: background 0.6s ease-out 0s; text-decoration: none; margin: 0.25rem; outline: none; } .social-share .social-share-icon img{ width: 1rem; height: 1rem; } .social-share .icon-weibo { color: #ff763b; border-color: #ff763b; } .social-share .icon-qq { color: #56b6e7; border-color: #56b6e7; } .social-share .icon-qzone { color: #FDBE3D; border-color: #FDBE3D; } .social-share .icon-wechat { position: relative; color: #7bc549; border-color: #7bc549; } .social-share .icon-wechat .wechat-qrcode { opacity: 0; filter: alpha(opacity = 0); visibility: hidden; position: absolute; z-index: 9; top: -12.8125rem; left: -5.25rem; width: 12.5rem; height: 12rem; color: #666; font-size: 0.75rem; text-align: center; background-color: #fff; box-shadow: 0 0.125rem 0.625rem #aaa; transition: all 200ms; -webkit-tansition: all 350ms; -moz-transition: all 350ms; } .social-share .icon-wechat .wechat-qrcode h4 { font-weight: normal; height: 1.625rem; line-height: 1.625rem; font-size: 0.75rem; background-color: #f3f3f3; margin: 0; padding: 0; color: #777 } .social-share .icon-wechat .wechat-qrcode .qrcode { width: 5.5625rem; margin: 0.625rem auto; } .social-share .icon-wechat .wechat-qrcode .qrcode img { width: 100%; height: 100%; } .social-share .icon-wechat .wechat-qrcode .help p { font-weight: normal; line-height: 1rem; padding: 0; margin: 0; } .social-share .icon-wechat .wechat-qrcode:after { content: ''; position: absolute; left: 50%; margin-left: -0.375rem; bottom: -0.8125rem; width: 0; height: 0; border-width: 0.5rem 0.375rem 0.375rem 0.375rem; border-style: solid; border-color: #fff transparent transparent transparent } .social-share .icon-wechat:hover .wechat-qrcode { opacity: 1; filter: alpha(opacity=100); visibility: visible } .botText{ line-height: 1.875rem; font-size: 0.875rem; color: #666; } .botText a{ color: #444; } .botText .bot-label { background-color: #e7e7e7; padding: 0.125rem 0.5rem; border-radius: 0.3125rem; margin-right: 0.5rem; } /* 列表页 */ .panel-heading { position: relative; padding: 0.9375rem 0; border-bottom: 0.125rem solid #f5f5f5; border-color: #ddd; color: #333333; } .panel-heading .panel-title { font-size: 1rem; margin-top: 0; margin-bottom: 0; text-align: left; } .panel-title strong { color: #2a79ff; } .panel-heading div.more { position: absolute; top: 1.0625rem; right: 0; display: block; color: #919191; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; font-weight: 400; font-size: 0.8125rem; } .list-inline { padding-left: 0; list-style: none; margin-left: -0.3125rem; } .list-inline > li { display: inline-block; padding-left: 0.3125rem; padding-right: 0.3125rem; } .category-order li > a { color: #333; } .category-order li > a.active { color: #007bff; } .navbar-form { border-color: #e7e7e7; } .form-search input[type=search] { background: url(../static/icon/search.svg) no-repeat 10px center; background-size: 15px 15px; border-color: transparent; padding: 6px 10px; border: 1px solid #ccc; width: 12.5rem; border-radius: 10em; text-indent: 1.4375rem; } @media (max-width: 767px) { .form-search input[type=search] { width: 21.5rem; background-size: 10px 10px; /* background: none; */ } } @media (max-width: 1120px) { .school_box_right { width: 100%; } .introduce_box_title { width: 100%; } .slider-content-banner{ margin-top: 1.25rem; display: flex; height: 4.375rem; border-radius: 0.125rem; overflow: hidden; box-sizing: content-box; cursor: pointer; position: inherit; } .sDetal .slider-content-banner { height: 8rem; } .sDetal .slider-content-item-ln { width: 15rem; } .slider-content-banner-txt-t { height: 2.5rem; line-height: 1.25rem; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; white-space: normal; } .slider-content-item-ln { position: relative; width: 6.5625rem; border-radius: 0.125rem; overflow: hidden; padding-right: 0.625rem; } .slider-content-banner-txt { position: inherit; background: none; color: #333; padding: 0; height: auto; } .slider-content-banner-txt-b { color: #999; font-size: 0.75rem; padding-top: 0.8125rem; } }