html, body { width: 100%; height: 100% } body { background-color: #f1f3f5; line-height: 24px; font: 14px helvetica neue, helvetica, pingfang sc, tahoma, arial, sans-serif; min-width: 1339px; } /* 把我们所有标签的内外边距清零 */ * { margin: 0; padding: 0; border: 0; } /* em 和 i 斜体的文字都不倾斜 */ em, i { font-style: normal } img { border: 0;/* 为了照顾低版本浏览器,如果 图片的外面包含了链接 会出现边框的问题 */ vertical-align: middle /* 解决图片底侧出现空白缝隙的问题 */ } button { cursor: pointer /* 当我们鼠标经过button按钮时,鼠标变成小手的样子 */ } a { text-decoration: none } /*a:hover {*/ /* color: #c81623*/ /*}*/ button, input { font-family: microsoft yahei, heiti sc, tahoma, arial, hiragino sans gb, "\5b8b\4f53", sans-serif } .t-box{ display: flex; justify-content: space-between; align-items: center; width: 1339px; height: 130px; margin: 0 auto; } .log-w{ width: 266px; height: 66px; } .log-w .log{ width: 95px; height: 66px; } .weather{ width: 290px; height: 62px; padding-right: 10px; display: flex; } .weather a{ margin-top: 11px; margin-left: 15px; font-size: 16px; color: #666; font-weight: bolder; } .weather a:hover{ color: #666; } #low{ color:#8fd535; } #high{ color:#e4623b; } .input-box { position: relative; margin: 0 auto; z-index: 1; width: 345px; height: 44px; } .tv-app{ width: 308px; height: 67px; display: flex; justify-content: space-between; } .tv-app ul{ display: none; position: absolute; margin-left: -5px; z-index: 999; } .tv-app ul img{ width: 80px; height: 80px; } .input-box button { position: absolute; right: 12px; top: 0; width: 70px; height: 39px; border-radius: 20px; border: 2px solid #1e9cde; background: no-repeat center #1e9cde; z-index: 1; } .input-box input { position: absolute; width: 320px; height: 36px; border: 2px solid #1e9cde; border-radius: 20px; font-size: 18px; padding-left: 10px; /*color: rgba(255, 255, 255, .8);*/ outline: none; } .class_box{ width: 100%; height: 88px; display: flex; justify-content: center; background-color: #1e9cde; } .class_content{ width: 1340px; display: flex; justify-content: space-between; } .class_group{ display: flex; flex-direction: row; justify-content: space-between; flex-wrap: wrap; padding: 5px 5px; position: relative; box-sizing: border-box; align-items: center; } .class_group::before{ content: ''; position: absolute; left: 100%; top: 50%; width: 2px; height: 70px; background-color: rgba(161, 210, 242, 0.24); transform: translate(-50%, -50%); } .class_group:last-child::before { content: ""; display: none; } .cnews{ width: 300px; } .cxianqu{ width: 660px; } .clife{ width: 280px; } .cother{ width: 400px; } .class_item{ font-size: 20px; color: #ffffff; padding: 5px 15px; transition: all .2s; -webkit-transition: all .2s; /*cursor: pointer;*/ position: relative; border-radius: 20px; } .class_item a{ color: #ffffff; } .class_item a:hover{ color: #ffffff; } .class_item:hover{ background: rgba(255, 255, 255, 0.2); /*cursor: pointer;*/ } /*内容部分样式*/ .content-box { width: 1339px; margin: 0 auto; padding-bottom: 30px; } /*头题样式*/ .content-top { background-color: #ffffff; border-radius: 10px; margin-top: 15px; box-shadow: #d6e1e7 6px 3px 30px 2px; } .ct_one{ line-height: 40px; text-align: center; font-size: 30px; padding: 15px 50px 5px; font-weight: 600; cursor: pointer; } .ct_one a{ color: #1e9cde; } .content-top a:hover{ color: #0d4290; } .ct_second{ display: flex; justify-content: space-around; padding: 0 30px 5px; align-items: center; } .ct_second_box{ display: flex; justify-content: space-around; flex: auto; } .ct_second_child{ padding: 5px 2px 5px 10px; position: relative; box-sizing: border-box; flex: auto; } .ct_second_child a{ font-size: 18px; color: #1e9cde; line-height: 2em; width: 360px; text-align: center; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; -webkit-line-clamp: 1; -webkit-box-orient: vertical; display: -webkit-box; cursor: pointer; } .ct_second_child::before { content: ''; position: absolute; left: 95%; top: 50%; width: 2px; height: 16px; background-color: rgba(3, 107, 177, 0.68); transform: translate(-50%, -50%); } .ct_second_child:last-child::before { content: ""; display: none; } .top_banner { width: 100%; height: 110px; margin-top: 15px; box-shadow: #d6e1e7 6px 3px 30px 2px; } .top_banner img{ width: 1337px !important; height: 110px !important; /*object-fit: cover;*/ } /*内容部分样式*/ .lunbo_redian { margin: 0 auto; padding-bottom: 15px; width: 100%; height: auto; display: flex; padding-top: 15px; } .lunbo_one{ width: 856px; height: 478px; } .redian{ width: 470px; height: 478px; background: #ffffff; box-shadow: 0px 0px 6px 0px rgba(105, 113, 144, 0.19); margin-left: 13px; } .redian_box{ padding-top: 12px; padding-left: 19px; } .lunbo_one_box { width: 100% !important; height: 100% !important; } .lunbo_one_img { box-sizing: border-box; width: 100%; height: 100%; display: flex; position: relative; overflow: hidden; cursor: pointer; } .lunbo_one_img img { width: 100%; height: 100%; margin: 0 auto; object-fit: cover; } .lunbo_one_img > div { position: absolute; width: 100%; height: 95px; bottom: 0; background: linear-gradient(0, rgb(27 41 68 / 55%), rgba(243, 215, 215, 0.1)); align-items: center; justify-content: flex-start; box-sizing: border-box; padding: 0 20px; color: #f0f0f0; font-size: 26px; text-align: left; line-height: 80px; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; -webkit-line-clamp: 1; -webkit-box-orient: vertical; display: -webkit-box; } .re_table_list{ box-sizing:border-box; width: 92%; height: 38px; border-bottom: 2px solid rgba(3, 107, 177, 0.61); } .re_table_list ul li{ float: left; width: 207px; height: 38px; text-align: center; cursor: pointer; font-size: 24px; font-weight: 700; color: #3d8fc6; letter-spacing: 0.1em; } .re_table_list .current{ box-sizing:border-box; flex: none; overflow: hidden; text-overflow: ellipsis; color: #1e9cde; border-bottom: 5px solid #1e9cde; transition: all .1s; } .re_table_cont{ margin: 12px 11px 8px -11px; } .re_table_cont .item{ display: none; } .re_table_cont .item a{ line-height: 1em; flex: auto; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; -webkit-line-clamp: 1; -webkit-box-orient: vertical; /*display: -webkit-box;*/ white-space:nowrap; -o-text-overflow:ellipsis; } .re_table_cont li>a::before{ content: ""; width: 9px; height: 9px; border-radius: 50%; background: #ffffff; position: absolute; left: 15px; margin-top: 3px; border: 4px solid #249fdf; } .re_table_cont li{ padding: 20px 16px 10px 40px; display: flex; justify-content:space-between; position: relative; font-size: 20px; transition: all 0.2s; } .re_table_cont li:hover{ transform: scale(1.05); -ms-transform: scale(1.05); -webkit-transform: scale(1.05); } .re_table_cont .item a:hover{ color: #249fdf; font-weight: 700; } .news_list{ width: 100%; height: auto; } .nl_box_one{ margin: 0 auto; padding-top: 5px; padding-bottom: 15px; width: 100%; height: auto; display: flex; justify-content: space-between; } .nl_box_two{ margin: 0 auto; padding-top: 5px; padding-bottom: 15px; width: 100%; height: auto; display: flex; justify-content: space-between; } .nl_block{ width: 661px; height: 505px; background: #ffffff; box-shadow: 0px 0px 6px 0px rgba(105, 113, 144, 0.19); } /*新闻列表块*/ .nl_block_list{ box-sizing:border-box; width: 95%; height: 38px; border-bottom: 2px solid rgba(3, 107, 177, 0.61); } .nl_block_list ul li{ float: left; /*width: 153px;*/ height: 38px; text-align: center; cursor: pointer; font-size: 24px; font-weight: 700; color: #3d8fc6; letter-spacing: 0.1em; } .nl_block_list .current_nl{ box-sizing:border-box; flex: none; overflow: hidden; text-overflow: ellipsis; color: #1e9cde; border-bottom: 5px solid #1e9cde; } .nl_block_more{ float: right; color: #1e9cde; font-size: 16px; font-weight: bold; cursor: pointer; padding-top: 15px; } .nl_block_cont{ margin: 12px 11px 8px -11px; } .nl_block_cont .item li>a{ line-height: 1em; flex: auto; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; -webkit-line-clamp: 1; -webkit-box-orient: vertical; /*display: -webkit-box;*/ white-space:nowrap; -o-text-overflow:ellipsis; -icab-text-overflow: ellipsis; -khtml-text-overflow: ellipsis; -moz-text-overflow: ellipsis; -webkit-text-overflow: ellipsis; } .nl_block_cont .item li>span{ flex: none; padding: 0 8px 0 15px; line-height: 1em; color: #3d8fc6; } .nl_block_cont a::before{ content: ""; width: 12px; height: 12px; border-radius: 50%; background: #249fdf; position: absolute; left: 15px; margin-top: 3px; } .nl_block_cont li{ padding: 10px 20px 20px 40px; display: flex; justify-content:space-between; position: relative; font-size: 18px; } /*.nl_block_cont li>a:hover{*/ /* transform: scale(1.05);*/ /*}*/ .nl_block_cont .item li>a:hover{ color: #249fdf; font-weight: 700; } .nl_block{ box-sizing:border-box; padding-top: 12px; padding-left: 19px; } .nl_block_cont .first_art{ display: flex; width: 95%; height: 180px; justify-content: space-around; padding-left: 15px; padding-right: 10px; } .left-news_tu { flex: none; width: 218px; height: 144px; cursor: pointer; padding-top: 15px; } .left-news_tu img { width: 100%; height: 100%; } .left-news_wen { padding: 15px 20px 15px 30px; width: 393px; } .left-news_wen_t a{ font-size: 20px; font-weight: bold; color: #249fdf; line-height: 28px; cursor: pointer; text-align: justify; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; -webkit-line-clamp: 1; -webkit-box-orient: vertical; display: -webkit-box; cursor: pointer; } .left-news_wen_t a:hover{ color: #249fdf; font-weight: 700; } .left-news_wen a::before{ display: none; } /*.left-news_wen span:hover {*/ /* color: #249fdf;*/ /*}*/ .left-news_wen_d span{ color: #249fdf; font-size: 16px; line-height: 28px; text-align: justify; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; -webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -webkit-box; } .left-news_wen_t{ padding: 5px 0 15px 0; } /*视听武威*/ .content-shiting { width: 100%; /*height: 450px;*/ margin-top: 10px; background: linear-gradient(to right, #c2e5f6, #f8efeb); } .content-shiting_biaoti { padding-top: 20px; text-align: center; width: 100%; height: 70px; background: no-repeat center center; } .content-shiting_biaoti span { font-size: 24px; color: #249fdf; font-weight: 600; } .shiting-news { width: 100%; height: 170px; flex: none; /*overflow: hidden;*/ position: relative; display: flex; } .shiting-news-title { margin: 22px 0 0 28px; width: 40px; height: 112px; flex: none; overflow: hidden; background: linear-gradient( #b6d6fb, #b9b6e5);; /*position: relative;*/ } .shiting-news-title-zi{ background-color: #1e9cde; position: absolute; width: 40px; height: 112px; display: flex; align-content: center; justify-content: center; align-items: center; margin: -5px 0px 0px -6px; } .shiting-news-title-zi span{ font-size: 20px; font-weight: 700; color: white; line-height: 36px; } .shiting-news-box { width: 95%; height: 100%; flex: none; overflow: hidden; /*position: relative;*/ } .shiting-lunbo_img { width: 95% !important; height: 85% !important; margin-left: 20px; background-color: unset !important; } .shiting-lunbo_img > [carousel-item]:before { display: none !important; } .shiting-lunbo { box-sizing: border-box; width: 100%; height: 100%; /*position: relative;*/ overflow: hidden; background-color: unset !important; } .shiting-lunbo__box { width: 100%; height: 100%; display: flex; } .shiting-lunbo_min { position: relative; flex: 1; margin: 0 5px; cursor: pointer; } .shiting-lunbo_min img { width: 100%; height: 100%; margin: 0 auto; object-fit: cover; } .shiting-lunbo_min > div { position: absolute; width: 100%; height: 25px; bottom: 0; background: rgba(80, 77, 77, 0.09); align-items: center; justify-content: flex-start; box-sizing: border-box; color: #f0f0f0; font-size: 14px; padding-left: 20px; line-height: 25px; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; -webkit-line-clamp: 1; -webkit-box-orient: vertical; display: -webkit-box; } .shiting-lunbo_min::before{ content: ''; z-index: 999; position: absolute; width: 40px; height: 40px; background: no-repeat; opacity: 0.6; right: 0; left: 40%; bottom: 40%; background-size: 100%; /*background-color: yellow;*/ } .shiting-lunbo_zt { position: relative; flex: 1; margin: 0 5px; cursor: pointer; } .shiting-lunbo_zt img { width: 100%; height: 100%; margin: 0 auto; object-fit: cover; } .shiting-lunbo_zt > div { position: absolute; width: 100%; height: 25px; bottom: 0; background: rgba(80, 77, 77, 0.09); align-items: center; justify-content: flex-start; box-sizing: border-box; color: #f0f0f0; font-size: 14px; padding-left: 20px; line-height: 25px; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; -webkit-line-clamp: 1; -webkit-box-orient: vertical; display: -webkit-box; } .shiting-lunbo_zt::after{ content: "专题"; position: absolute; width: 60px; height: 24px; line-height: 24px; background-color: #1e9cde; border-bottom-right-radius: 8px; top: 0; left: 0; color: #f0f0f0; font-size: 14px; z-index: 3; text-align: center; } .shiting-lunbo_img .layui-carousel-ind { position: relative; top: 5px; width: 100%; line-height: 0 !important; text-align: center; font-size: 0; } .shiting-lunbo_img .layui-carousel-ind ul { background-color: unset !important; } .shiting-zhibo-box { width: 100%; height: 200px; } /*视听武威*/ /*双banner广告栏开始*/ .banner_db{ width: 100%; height: 113px; margin-top: 25px; box-shadow: #d6e1e7 6px 3px 30px 2px; } .banner_db-box{ display: flex; justify-content: space-between; } .banner_db_image1 { width: 875px; height: 113px; } .banner_db_image1 > .layui-carousel > .layui-carousel-ind ul{ background-color: rgba(0,0,0,0); } .banner_db_image1 .layui-carousel[lay-anim=updown] .layui-carousel-ind { right: 2px; } /*六块新闻列表开始*/ .six_news_list{ width: 100%; height: auto; margin-top: 20px; } .six_news_box{ display: flex; justify-content: space-between; } .four_news_list{ width: 985px; } .f_nl_block{ width: 485px; height: 505px; background: #ffffff; box-shadow: 0px 0px 6px 0px rgba(105, 113, 144, 0.19); box-sizing:border-box; padding-top: 12px; padding-left: 19px; } .f_nl_box_one{ margin: 0 auto; padding-top: 5px; padding-bottom: 15px; width: 100%; height: auto; display: flex; justify-content: space-between; } .f_nl_box_two{ margin: 0 auto; padding-top: 5px; padding-bottom: 15px; width: 100%; height: auto; display: flex; justify-content: space-between; } .news_shuzi_box{ width: 342px; display: flex; flex-direction: column; justify-content: space-between; padding: 5px 0 15px 0; } .gongyi{ width: 342px; height: 390px; background: #ffffff; box-shadow: 0px 0px 6px 0px rgba(105, 113, 144, 0.19); } .yulun{ width: 345px; height: 180px; background: #ffffff; box-shadow: 0px 0px 6px 0px rgba(105, 113, 144, 0.19); } .shuzibao{ width: 342px; height: 422px; background: #ffffff; box-shadow: 0px 0px 6px 0px rgba(105, 113, 144, 0.19); } .gongyi_block{ width: 100%; height: 100%; background: #ffffff; box-shadow: 0px 0px 6px 0px rgba(105, 113, 144, 0.19); box-sizing:border-box; padding-top: 12px; padding-left: 19px; overflow: hidden; } .gongyi_block_list{ box-sizing:border-box; width: 95%; height: 38px; border-bottom: 2px solid rgba(3, 107, 177, 0.61); } .gongyi_block_list ul li{ float: left; /*width: 153px;*/ height: 38px; text-align: center; cursor: pointer; font-size: 24px; font-weight: 700; color: #3d8fc6; letter-spacing: 0.1em; } .gongyi_block_list .current_nl{ box-sizing:border-box; flex: none; overflow: hidden; text-overflow: ellipsis; color: #1e9cde; border-bottom: 5px solid #1e9cde; } .gongyi_block_cont{ margin: 0 11px 0px -11px; } .gongyi_block_cont a::before{ content: ""; width: 12px; height: 12px; border-radius: 50%; background: #249fdf; position: absolute; left: 15px; margin-top: 3px; } .gongyi_block_cont li{ padding: 15px 20px 10px 40px; display: flex; justify-content:space-between; position: relative; font-size: 18px; } .gongyi_block_cont .item li>a:hover{ color: #249fdf; font-weight: 700; } .gongyi_block_cont .item li>a{ line-height: 1em; flex: auto; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; -webkit-line-clamp: 1; -webkit-box-orient: vertical; /*display: -webkit-box;*/ white-space:nowrap; -o-text-overflow:ellipsis; -icab-text-overflow: ellipsis; -khtml-text-overflow: ellipsis; -moz-text-overflow: ellipsis; -webkit-text-overflow: ellipsis; } .gongyi_block_img{ width: 230px; height: 310px; padding-left: 40px; } /*公益轮播*/ .carouselpar { height: 300px; margin: 15px auto 0; padding: 5px 0px; /*text-align: center;*/ position: relative; } .carouselpar .carousel { position: relative; overflow: hidden; } .carouselpar .sltm-carousle { width: 100%; /*height: 169px;*/ } .lf { float: left; } .carouselpar #carouselzt ul { padding-left: 0; } .carouselpar .carousel-img { position: absolute; top: 0; left: 0; height: 100%; } .carousel-img { position: absolute; top: 0; left: 0; height: 100%; } .sltm-carousle { width: 100%; height: 100%; } .carousel { overflow: hidden; /*width: 507px;*/ /*height: 327px;*/ position: relative; } .carouselpar .carousel-img li { height: 100%; width: 301px; float: left; /*padding: 0 2px 0 0;*/ } .carousel-img li { height: 100%; width: 100%; } .carousel-img li a { overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; -webkit-line-clamp: 1; -webkit-box-orient: vertical; display: -webkit-box; } .carousel-img li a img { width: 230px; height: 300px; } .carl-btn { padding: 0 5px; margin-top: 63px; position: absolute; top: 5px; cursor: pointer; z-index: 999; } .carl-btn img { /*height: 45px;*/ margin: 0 auto; } .pre, .next { /*display: block;*/ } .pre { left: 0px; top: 70px; } .next { right: 0px; top: 70px; } /*数字报轮播*/ .szb_block{ padding: 12px 19px 0 19px; } .szb-box { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; padding-top: 20px; box-sizing: border-box; cursor: pointer; } .szb-box_bg { position: absolute; width: 304px; padding-top: 20px; } .szb-box_bg img{ position: absolute; } /*.szb-box_bg img:last-child{*/ /* right: 0;*/ /*}*/ .szb-box_bg img { width: 304px; height: 300px; filter: blur(3px); z-index: 0; } .szb-box img { width: 210px; height: 300px; object-fit: contain; box-shadow: 0 0 10px #249fdf; z-index: 99; transition: all 0.2s; } .szb-box div { margin-top: 10px; font-size: 22px; font-weight: bold; color: #249fdf; letter-spacing: 0.2em; z-index: 9; background-color: rgba(0, 109, 172, 0.03); } .szb-box img:hover{ transform: scale(1.05); -ms-transform: scale(1.05); -webkit-transform: scale(1.05); } .wutu_zhuanti_lunbo > .carouselpar{ height: 157px; } .wutu_lunbo{ margin: 0 !important; } .wutu_lunbo .carl-btn{ margin-top: 0px !important; padding: 0 !important; } .wutu_lunbo .carl-btn img{ height: 50px !important; } .wutu_lunbo .carousel-img li{ width: 270px !important; } .wutu_lunbo .carousel-img li a img { width: 270px !important; height: 157px !important; } .wutu_zhuanti_lunbo >.wutu_lunbo > .pre { left: -45px; top: 36%; } .wutu_zhuanti_lunbo >.wutu_lunbo > .next { right: -55px; top: 36%; } .wutu_zhuanti_lunbo >.carouselpar .carousel-img li { height: 157px; width: 270px; margin-right: 20px; } .med_banner { margin-bottom: 15px; width: 1337px; height: 138px; box-shadow: #d6e1e7 6px 3px 30px 2px; } .med_banner img{ width: 1337px !important; height: 138px !important; } .rongmei{ margin-top: 20px; display: flex; justify-content: space-between; } .rongmei_left{ position: relative; height: 616px; width: 600px; } .rongmei_left_img{ position: absolute; bottom: 0; left: -60px; } .rongmei_left_zi{ display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; position: absolute; bottom: 96px; right: 230px; width: 231px; height: 90px; } .rongmei_left_zi span{ font-weight: bold; font-size: 36px; color: #ffffff; letter-spacing: 9px; } .rongmei_left_zi a{ font-size: 20px; color: #ffffff; letter-spacing: 3px; font-family: fzyouheis_gbjt-db-gb; } .rongmei_left_zi a:hover{ font-size: 20px; color: #ffffff; letter-spacing: 3px; transform: scale(1.1); -ms-transform: scale(1.1); -webkit-transform: scale(1.1); transition: all .1s; } .rongmei_right{ width: 728px; height: 616px; } .shijue{ margin-top: 20px; display: flex; justify-content: space-between; } .shijue_right{ position: relative; height: 616px; width: 600px; } .shijue_right_img{ position: absolute; height: 616px; width: 600px; bottom: 0; } .shijue_right_img_bot::before{ content: ''; width: 225px; height: 170px; bottom: 0; right:0; position: absolute; background: no-repeat; } .shijue_right_img_top{ position: absolute; right: 0px; top: 18px; } .shijue_right_img_bot{ position: absolute; right: 0; bottom: 0; } .shijue_right_zi{ display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; position: absolute; bottom: 96px; right: 200px; width: 231px; height: 90px; } .shijue_right_zi span{ font-weight: bold; font-size: 36px; color: #ffffff; letter-spacing: 9px; } .shijue_right_zi a{ font-size: 20px; color: #ffffff; letter-spacing: 3px; font-family: fzyouheis_gbjt-db-gb; } .shijue_right_zi a:hover{ font-size: 20px; color: #ffffff; letter-spacing: 3px; transform: scale(1.1); -ms-transform: scale(1.1); -webkit-transform: scale(1.1); transition: all .1s; } .shijue_left{ width: 737px; height: 616px; display: flex; flex-wrap: wrap; align-content: space-between; justify-content: space-between; } .shijue_left_img{ margin-top: 18px; width: 363px; height: 281px; box-shadow: 0px 0px 6px 0px rgba(105, 113, 144, 0.19); position: relative; } .shijue_left_img img{ width: 363px; height: 281px; } .shijue-text { position: absolute; width: 100%; height: 100%; bottom: 0; opacity: 0; transition: all 1s; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; -webkit-line-clamp: 1; -webkit-box-orient: vertical; display: -webkit-box; text-align: center; letter-spacing: 4px; background-color: rgba(137, 27, 27, 0.5); } .shijue-text a{ line-height: 12em; color: #f0f0f0; font-size: 24px; font-weight: bold; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; -webkit-line-clamp: 1; -webkit-box-orient: vertical; display: -webkit-box; text-align: center; letter-spacing: 4px; } .shijue-text a:hover{ color: #f0f0f0; } .shijue-active{ opacity: 1; } .container{ display: flex; width: 90vw; max-width: 728px; height: 616px; overflow: hidden; } .container .item{ position: relative; width: 60px; margin: 10px; border-radius: 5px; background-size: cover; background-position: center; transition: 0.5s cubic-bezier(0.05,0.61,0.41,0.95); overflow: hidden; box-shadow: 0 0 4px #249fdf; } .container .item .shadow{ position: absolute; bottom: 0; left: 0; right: 0; height: 100px; transition: 0.5s cubic-bezier(0.05,0.61,0.41,0.95); } .container .item .content{ display: flex; position: absolute; left: 10px; right: 0; bottom: 10px; height: 40px; transition: 0.5s cubic-bezier(0.05,0.61,0.41,0.95); } .container .item .content .icon{ min-width: 40px; width: 40px; height: 40px; border-radius: 50%; background-color: #fff; display: flex; justify-content: center; align-items: center; font-size: 16px; } .container .item .content .text{ display: flex; flex-direction: column; justify-content: center; margin-left: 10px; color: #fff; width: 100%; } .container .item .content .text a{ color: #cccfd1; width: calc(100% - 70px); text-overflow: ellipsis; overflow: hidden; white-space: nowrap; opacity: 0; transition: opacity 0.5s ease-out; } .container .item .content .text .tit{ font-weight: bold; font-size: 18px; transition: all .1s; } .container .item .content .text .tit:hover{ transform: scale(1.1); -ms-transform: scale(1.1); -webkit-transform: scale(1.1); color: #fff; } .container .item .content .text .sub{ transition-delay: 0.1s; } /* 选中态样式 */ .container .item.active{ flex: 1; margin: 0; } .container .item.active .shadow{ background: linear-gradient(to top,rgba(0,0,0,0.35) 65%,transparent); } .container .item.active .content{ bottom: 20px; left: 20px; } .container .item.active .content .text a{ opacity: 1; } /*友情链接*/ .content-youqing { width: 100%; margin-top: 10px; background: #d9edf9; box-shadow: 0px 0px 6px 0px rgba(105, 113, 144, 0.19); } .content-youqing_biaoti { padding-top: 20px; width: 100%; height: 70px; background: no-repeat center center; } .content-youqing_biaoti span { padding-left: 56px; font-size: 24px; color: #249fdf; font-weight: 600; } .content-wangzhan { min-height: 180px; margin: 0 20px; } .wangzhan_biaoti { height: 40px; } .table4_list ul li { font-size: 20px; font-family:arial,helvetica,sans-serif; float: left; height: 40px; line-height: 40px; width: 160px; text-align: center; cursor: pointer; } .table4_list .current { background: #249fdf; height: 38px; color: white; transition: all .3s; } .table4_con { height: auto; padding: 10px; } .table4_con .item{ width: 100%; min-height: 40px; flex-wrap: wrap; justify-content: flex-start; } .table4_con .item a { font-size: 18px; color: #249fdf; line-height: 40px; font-weight: 600; padding: 5px 22px; cursor: pointer; display: block; } .table4_con .item span { font-size: 18px; color: #249fdf; line-height: 40px; font-weight: 600; padding-top: 5px ; cursor: pointer; display: block; } /*底部样式*/ .bottom { height: 310px; width: 100%; position: relative; background-color: #1e9cde; } .bot_f { height: 15px; width: 460px; padding-top: 50px; margin: 0 auto; display: flex; justify-content: space-between; } .bot_f div { padding: 0 10px; transition: all .1s; } .bot_f div span { font-size: 16px; color: #ffffff; position: relative; cursor: pointer; } .bot_f div img { width: 18px; height: auto; } .bot_f div:hover { transform: scale(1.1); } .bot_s { height: 20px; width: 100%; margin: 23px auto; font-size: 14px; } .bot_s div { display: flex; justify-content: center; } .bot_s div span { font-size: 15px; color: #ffffff; padding: 3px 10px; letter-spacing: 1px; } .bot_l{ align-items: center; margin-top: 15px; } .bot_l a{ padding: 15px; } .slider_bar { position: fixed; top: 54vh; right: 3px; width: 68px; height: 68px; display: flex; flex-direction: column; justify-content: start; align-items: center; z-index: 9999; transition: all .5s; cursor: pointer; } .baoliao_bar { position: fixed; top: 64vh; right: 3px; width: 68px; height: 68px; display: flex; flex-direction: column; justify-content: start; align-items: center; z-index: 99; transition: all .5s; cursor: pointer; } .slider_bar img{ width: 68px; height: 68px; } .baoliao_bar img{ width: 68px; height: 68px; } .slider_bar span{ width: 74px; height: 18px; font-size: 14px; font-family: fzyouheis_gbjt-l-gb; font-weight: bold; color: #1e9cde; }.baoliao_bar span{ width: 74px; height: 18px; font-size: 14px; font-family: fzyouheis_gbjt-l-gb; font-weight: bold; color: #1e9cde; } .slider_bar:hover{ transform: scale(1.1); } .baoliao_bar:hover{ transform: scale(1.1); } .backmessage { position: fixed; top: 50vh; right: 80px; box-shadow: 0 0 4px #249fdf; background-color: #fff; z-index: 999; width: 410px; height: 290px; padding: 28px; border: 1px solid #c1bcbc; border-radius: 5px; transition: all .5s; animation: myfirst .5s; } @keyframes myfirst { 0% { opacity: 0; transform: translatex(100%) } 100% { opacity: 1; transform: translatex(0) } } .tousuinput .layui-input{ margin-bottom: 15px; } .star { color: #e70012; position: absolute; left: 10px; top: 37px; } .sanjiao { position: absolute; top: 37vh; right: -8px; display: block; width: 10px; height: 10px; background-color: #fff; border: 2px solid #249fdf8a; border-bottom: none; border-right: none; transform: rotate( 135deg ); } /*推送公告弹窗*/ .announcement { width: 270px; height: 220px; position: fixed; bottom: 0; right: 0; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); z-index: 1000; background-color: #ffffff; border: 1px solid #007bff; border-radius: 10px; transition: transform 0.5s ease, opacity 0.5s ease; } .announcement.slide-out { transform: translatey(100%); opacity: 0; } .announcement .close_btn { position: absolute; top: 5%; right: 3%; width: 16px; height: 16px; cursor: pointer; } .announcement p a{ font-weight: bold; font-size: 18px; color: #ffffff; background-color: #2461ba; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; -webkit-line-clamp: 1; -webkit-box-orient: vertical; display: -webkit-box; padding: 10px 25px 3px 20px; border-radius: 10px 10px 0 0; line-height: 40px; } .announcement span { text-indent: 2em; letter-spacing: 0.5px; line-height: 25px; padding:10px 5px 0 10px; font-size: 14px; color: #494949; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; -webkit-line-clamp: 5; -webkit-box-orient: vertical; display: -webkit-box; } .announcement a{ padding:10px 10px 0 10px; color: #db5861; text-decoration: none; } .announcement a:hover { color: #db5861; }