/* 一、超大屏 @media screen and (min-width:1200px){ } 二、1100分辨率（大于960px，小于1199px） @media screen and (min-width: 960px) and (max-width: 1199px) { } 三、880分辨率（大于768px，小于959px） @media screen and (min-width: 768px) and (max-width: 959px) { } 四、720分辨率（大于480px，小于767px） @media only screen and (min-width: 480px) and (max-width: 767px){ } 五、440分辨率以下（小于479px） @media only screen and (max-width: 479px) { } */ body{ padding-top: 00px;/*为了防止导航栏与页面主体中的其他内容的顶部相交错，需要向标签添加内边距，内边距的值至少是导航栏的高度*/ } /*列表页-面包屑*/ .crumbs { border-bottom: 1px solid #f3f3f3; color: #444444; } .crumbs_nav { padding: 10px 0px 10px 0px; } .crumbs_nav span { border-left: 8px solid #adadad; padding-left: 8px; } .crumbs_nav a { color: #444444; } .crumbs_nav a:hover { color: #f3770e; text-decoration: none; } /*列表页-右栏*/ .aside_dfl_news_head { clear: both; } .aside_dfl_news_head h2 { height: 50px; font-size: 22px; font-weight: normal; color: #545454; line-height: 50px; border-bottom: 1px solid #ebebeb; } .aside_dfl_news_head h2 span { display: inline-block; height: 50px; border-bottom: 1px solid #bbbbbb; } /*通用列表页-左侧栏目*/ .left_h3 { margin-top: 19px; font-size: 22px; font-weight: normal; color: #545454; line-height: 50px; border-bottom: 1px solid #ebebeb; } .left_h3 span { display: inline-block; height: 50px; border-bottom: 1px solid #bbbbbb; } .left_column ul.header_dfl_left_nav_ul { list-style: none; padding: 0px; margin: 15px 0px 0px 0px; padding-bottom: 10px; } .left_column ul.header_dfl_left_nav_ul > li { margin-bottom: 5px; border-bottom: 1px solid #f2f2f2; background: url(../Img/left_li.gif) 6px 12px no-repeat; } .left_column ul.header_dfl_left_nav_ul > li > a { display: block; text-decoration: none; color: #000; font-size: 14px; background: transparent; border-radius: 0px; padding: 6px 0px 6px 18px; margin-bottom: 8px; } .left_column ul.header_dfl_left_nav_ul > li > a:hover, .left_column ul.header_dfl_left_nav_ul li a.left_active { color: #f3770e; background: transparent; } .curr { color: #f3770e !important; } /*通用列表页-左侧二级栏目*/ .left_column ul.left_snav_ul { list-style: none; padding: 0px; } .left_column ul.left_snav_ul > li { margin-bottom: 7px; border-bottom: 1px solid #f2f2f2; background: url(../Img/left_sli.gif) 15px 11px no-repeat; } .left_column ul.left_snav_ul > li > a { display: block; text-decoration: none; color: #000; padding: 5px 0px 5px 25px; background: transparent; border-radius: 25px; margin-bottom: 8px; } .left_column ul.left_snav_ul > li > a:hover { color: #f3770e; background: transparent; } /*左侧新闻*/ .header_dfl_left_news { clear: both; list-style: none; margin: 0px; padding: 0px; } .header_dfl_left_news li { color: #545455; border-bottom: 1px dotted #dddddd; background: url(../Img/li.png) no-repeat left 15px; line-height: 21px; padding: 10px 0px; padding-left: 14px; display: list-item; text-align: -webkit-match-parent; } .header_dfl_left_news li a { display:inline-block; color: #2F2F2F; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;/*当文本溢出时显示…此时还必须定义：*/ } .header_dfl_left_news li a:hover, .header_dfl_left_news li a:focus { text-decoration: none; color: #f3770e; } /*左侧联系*/ .left_contact { margin: 30px 0px 35px 0px; } .header_dfl_left_contact p { clear: both; } .news_time { float: right; } /*通用列表页-左侧栏目*/ .header_left_h3 { margin-top: 19px; font-size: 22px; font-weight: normal; color: #545454; line-height: 50px; border-bottom: 1px solid #ebebeb; } .header_left_h3 span { display: inline-block; height: 50px; border-bottom: 1px solid #bbbbbb; } /*上一个下一个*/ .dfl_bottom_nav { clear: both; margin: 20px 0px 40px 0px; padding-bottom: 40px; line-height: 22px; } .dfl_bottom_nav span.to_prev { text-align: center; } .dfl_bottom_nav span.to_prev a { color: #337AB7; } .dfl_bottom_nav span.to_prev a:hover { color: black; } .dfl_bottom_nav span.to_next { text-align: center; } .dfl_bottom_nav span.to_next a { color: #337AB7; } .dfl_bottom_nav span.to_next a:hover { color: black; } .relevant_new ul.right_new li { font-size: 14px; } /*底部信息*/ footer { margin-top: 20px; color: #dcdcdc; padding: 60px 0px 40px 0px; background-color: #2b2b2b; } .footer_logo { max-width: 196px; } .footer_logo_text { width: 196px; text-align: center; margin-top: 15px; padding-top: 15px; border-top: 1px solid #5f5f5f; line-height: 22px; } .footer_sitemap { color: #dcdcdc; } .footer_sitemap:hover, .footer_sitemap:focus { color: #fbf38f; text-decoration: none; } /*底部分类*/ .footer_menu a { color: #dcdcdc; } .footer_menu a:hover { color: #fbf38f; text-decoration: none; } .footer_menu_first { font-weight: bold; } .footer_menu_first a { color: #fff; } .footer_qrcode { max-width: 130px; } .footer_qrcode_text { width: 130px; text-align: center; margin-top: 15px; } /*底部翻译*/ .translate { background-color: #000; } .translate_btn { width: 130px; margin: 0 auto; padding-top: 20px; } /*内容*/ /*数据恢复设备*/ .dfl-device-title{ margin-top: 20px; margin-bottom: 20px; } .dfl-device-title h2{ text-align: center; padding-top: 16px; font-size: 28px; color: #3f3f3f; } .dfl-device-list{ clear: both; padding: 25px 0px 0px 0px; margin-right: -15px; margin-left: -15px; } /*产品列表父DIV*/ .dfl-device-list-img{ padding-left: 15px; padding-right: 15px; min-height: 340px; } .dfl-device-list-img img { margin-right: auto; margin-left: auto; display: block; max-height: 300px; max-width: 100%; height: auto; margin-bottom: 10px; padding: 0px 0px 0px 0px; } .dfl-device-list-img-item{ border: 1px solid #ddd; border-radius: 4px; overflow: hidden; } .device-img{ display: inline-block; max-width: 100%; height: auto; padding: 4px; line-height: 1.42857143; background-color: #fff; -webkit-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all 1.2s ease-in-out; } .device-img:hover{ transform: scale(1.2); } .device-name{ text-align: center; height: 40px; color: #333; } device-name a{ } /*这是一个什么*/ .center_tel { height: 414px; /* background: red;*/ } /*多种数据恢复*/ .dfl-recover-type-head h2{ text-align: center; margin-top: 60px; font-size: 28px; color: #000; } .dfl-recover-type-head p{ text-align: center; color: #FFFFFF; margin-top: 8px; background: black; } .dfl-recover-type-head span { display: block; margin: 0 auto; width: 40px; height: 3px; background-color: #bdbdbd; margin-bottom: 100px; margin-top: 15px; background: black; } .advantage_col { margin-top: 20px; margin-bottom: 50px; text-align: center; min-height: 185px; border-radius: 25px; /*border: 1px solid #000000;*/ } .advantage_col:hover { border-radius: 25px; background-image: linear-gradient(#fff, #f7f7f7); } .advantage_col img { display: block; margin: 0 auto; max-width: 200px; -webkit-transition: -webkit-transform 0.8s ease-out; -moz-transition: -moz-transform 0.8s ease-out; -o-transition: -o-transform 0.8s ease-out; -ms-transition: -ms-transform 0.8s ease-out; } .advantage_col img:hover { -webkit-transform: rotateZ(360deg); -moz-transform: rotateZ(360deg); -o-transform: rotateZ(360deg); -ms-transform: rotateZ(360deg); transform: rotateZ(360deg); } .advantage_col a { display: block; color: #333; font-size: 18px; padding-top: 20px; } .advantage_col a:hover { color: #f3770e; text-decoration: none; } .advantage_col p { color: #797979; text-align: center; padding-top: 0px; margin-top: 15px; } /*关于我们*/ .about_bg { padding-bottom: 50px; background-color: #f7f7f7; } .about_head { margin-bottom: 50px; } .about_head h2 { text-align: center; margin-top: 40px; font-size: 28px; color: #333; } .about_head p { text-align: center; color: #555; margin-top: 8px; } .about_head span { display: block; margin: 0 auto; width: 40px; height: 3px; background-color: #e53e40; margin-bottom: 50px; } .about_h3 { font-family: Arial; color: #e53e40; font-size: 45px; font-weight: bold; margin: 0px; } .about_p { font-size: 16px; color: #000; padding-bottom: 20px; border-bottom: 1px solid #dadada; } .about_content { line-height: 30px; color: #555; margin-top: 20px; } .about_btn { display: block; text-align: center; width: 140px; padding: 7px 0px; color: #fff; text-decoration: none; border-radius: 20px; background-color: #e53e40; margin-top: 20px; } .about_btn:hover, .about_btn:focus { color: #fff; text-decoration: none; background-color: #0546c3; border-radius: 12px; width: 160px; } .about_video { width: 100%; } .block { height:300px; background: blue; margin-bottom: 20px; } .block1 { width: 100%; margin-bottom: 20px; margin-top: 20px; border: 1px solid #000000; } .container { /*width: 1170px;*/ } .clearfix:before, .clearfix:after, .dl-horizontal dd:before, .dl-horizontal dd:after, .container:before, .container:after, .container-fluid:before, .container-fluid:after, .row:before, .row:after, .form-horizontal .form-group:before, .form-horizontal .form-group:after, .btn-toolbar:before, .btn-toolbar:after, .btn-group-vertical > .btn-group:before, .btn-group-vertical > .btn-group:after, .nav:before, .nav:after, .navbar:before, .navbar:after, .navbar-header:before, .navbar-header:after, .navbar-collapse:before, .navbar-collapse:after, .pager:before, .pager:after, .panel-body:before, .panel-body:after, .modal-footer:before, .modal-footer:after { display: table; content: " "; } .clearfix:after, .dl-horizontal dd:after, .container:after, .container-fluid:after, .row:after, .form-horizontal .form-group:after, .btn-toolbar:after, .btn-group-vertical > .btn-group:after, .nav:after, .navbar:after, .navbar-header:after, .navbar-collapse:after, .pager:after, .panel-body:after, .modal-footer:after { clear: both; } .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 { position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px; } /*解决方案&教程*/ .dfl-device-Solution-title{ margin-top: 55px; /* background: url(../images/case_head.jpg) ;*/ } .dfl-device-Solution-title h2{ text-align: center; padding-top: 16px; font-size: 28px; color: #3f3f3f; } .dfl-device-Solution-list{ clear: both; padding: 35px 0px 0px 0px; margin-right: -15px; margin-left: -15px; } .dfl-device-Solution_img { padding-left: 15px; padding-right: 15px; min-height: 270px; } .dfl-device-Solution_img img { margin-right: auto; margin-left: auto; display: block; max-height: 270px; max-width: 100%; height: auto; margin-bottom: 10px; padding: 0px 0px 0px 0px; } div.dfl-device-Solution_img { min-height: 220px; } .dfl-device-Solution-describe { text-align: center; height: 40px; } .dfl-device-Solution-describe a { color: #2F2F2F; } .dfl-device-Solution-describe a:hover { text-decoration: none; color: #f3770e; } /*新闻*/ .dfl-news { background-color: #f7f7f7; margin-top: 40px; padding-bottom: 30px; } .dfl-news_title { margin-bottom: 20px; } .dfl-news_title h2 { text-align: center; margin-top: 50px; font-size: 28px; color: #333; } .dfl-news_title p { text-align: center; color: #555; margin-top: 8px; } .dfl-news_title span { display: block; margin: 0 auto; width: 40px; height: 3px; background-color: #e53e40; } /*支持品牌*/ .support-brand-title{ } .support-brand-title { margin-top: 60px; margin-bottom: 30px; } .support-brand-title p { text-align: center; font-size: 24px; color: #333; margin-top: 8px; } .support-brand-title span { display: block; height: 3px; /*background: url(../images/cooperation_title.jpg) center center no-repeat;*/ } .support-brand-list { padding-left: 15px; padding-right: 15px; min-height: 180px; } .support-brand-list img { margin-right: auto; margin-left: auto; display: block; max-height: 170px; max-width: 100%; height: auto; margin-bottom: 10px; padding: 0px 0px 0px 0px; } /*新闻列表页*/ .dfl-right-list{ clear: both; list-style: none; margin: 0px; padding: 0px 0px 0px 0px; } .dfl-right-list li{ color: #898989; background: url(../Img/li.png) no-repeat left 15px; font-size: 16px; line-height: 22px; padding: 12px 0px; padding-left: 13px; border-bottom: 1px dashed #e3e2e2; } .dfl-right-list li a{ color: #2F2F2F; } .dfl-right-list li a:hover, .dfl-right-list li a:focus { text-decoration: none; color: #f3770e; } .dfl_right_list_time { float: right; } /*列表页-横幅*/ .page_bg { display:block!important; margin-top: 80px;/*BODY里面设置了下边距，这里就可以不要了*/ height: 320px; width: 100%; margin-bottom: 0px; /* background-size:100% 100%!important;*/ } /*详情页*/ .right_contents { clear: both; padding: 15px 0px 15px 0px; line-height: 28px; overflow: auto; } .right_contents_h1 { margin: 0px; padding: 10px 0px; text-align: center; color: #000; font-size: 24px; color: #434343; font-weight: bold; line-height: 34px; } .right_contents img { max-width: 840px; } /*详情页小标题*/ .entry-meta { font-size: 12px; margin-bottom: 20px; padding-bottom: 10px; text-align: center } .entry-meta span { margin: 0 10px } .entry-meta strong { font-weight: normal } .entry-meta a { color: #999 } .entry-meta { color: #999; font-size: 12px; margin-bottom: 10px } /*详情页里面的图片*/ #picContent img { max-width: 100%; height: auto !important; } /*产品-左侧栏目*/ .left_nav { padding: 20px 15px 30px 15px; background: url(/static/systemImages/left_head.jpg) no-repeat top center #767676; margin-top: 25px; margin-bottom: 20px; } .left_nav h3 { text-align: center; color: #fff; margin: 0px 0px 4px 0px; } .left_nav p { text-align: center; color: #fff; font-size: 14px; letter-spacing: 2px; margin-bottom: 10px; } .left_nav_bg { background: url(/static/systemImages/left_nav_bg.jpg) center bottom no-repeat #fff; padding: 10px 15px 22px 15px; } .left_nav_tel { margin: 220px 0px 0px 0px; text-align: center; color: #fff; font-size: 24px; font-weight: bold; } .left_nav_ul { list-style: none; padding: 0px; margin: 15px 0px 0px 0px; padding-bottom: 10px; } .left_nav_ul > li > a { display: block; text-decoration: none; color: #fff; font-size: 15px; background-color: #757575; border-radius: 5px; padding: 6px 0px 6px 18px; margin-bottom: 8px; } .left_nav_ul > li > a:hover, .left_nav_ul li a.left_active { color: #fff; background-color: #313131; } /*产品-左侧二级栏目*/ ul.left_snav_ul { list-style: none; padding: 0px; } ul.left_snav_ul > li { margin: 0px; } ul.left_snav_ul > li > a { display: block; text-decoration: none; color: #fff; padding: 5px 0px 5px 30px; background: url(../Img/left_tree.gif) 20px 8px no-repeat #8a8a8a; border-radius: 5px; margin-bottom: 8px; } ul.left_snav_ul > li > a:hover { color: #fff; background-color: #313131; } /*图片列表模板右边样式*/ .product_list2 { padding-top: 20px; } .product_img { padding-left: 15px; padding-right: 15px; min-height: 340px; } .product_img img { margin-right: auto; margin-left: auto; display: block; max-height: 300px; max-width: 100%; height: auto; /*margin-bottom: 10px;*/ /*padding: 0px 0px 0px 0px;*/ } .product_list2 div.product_img { min-height: 340px; } .product_title { text-align: center; height: 40px; } .product_head { margin-top: 40px; background: url(/images/product_head.jpg) center top no-repeat; } .product_head h2 { text-align: center; padding-top: 16px; font-size: 28px; color: #3f3f3f; } .product_list { clear: both; padding: 25px 0px 0px 0px; margin-right: -15px; margin-left: -15px; } .product_list2 { padding-top: 20px; } .product_img { padding-left: 15px; padding-right: 15px; min-height: 340px; } .product_img img { margin-right: auto; margin-left: auto; display: block; max-height: 300px; max-width: 100%; height: auto; margin-bottom: 10px; padding: 0px 0px 0px 0px; } .product_list2 div.product_img { min-height: 340px; } .product_title { text-align: center; height: 40px; } .product_head { margin-top: 40px; background: url(../images/product_head.jpg) center top no-repeat; } .product_head h2 { text-align: center; padding-top: 16px; font-size: 28px; color: #3f3f3f; } .product_list { clear: both; padding: 25px 0px 0px 0px; margin-right: -15px; margin-left: -15px; } .product_list2 { padding-top: 20px; } .product_img { padding-left: 15px; padding-right: 15px; min-height: 340px; } .product_img img { margin-right: auto; margin-left: auto; display: block; max-height: 300px; max-width: 100%; height: auto; margin-bottom: 10px; padding: 0px 0px 0px 0px; } .product_list2 div.product_img { min-height: 340px; } .product_title { text-align: center; height: 40px; } .product_head { margin-top: 40px; background: url(../images/product_head.jpg) center top no-repeat; } .product_head h2 { text-align: center; padding-top: 16px; font-size: 28px; color: #3f3f3f; } .product_list { clear: both; padding: 25px 0px 0px 0px; margin-right: -15px; margin-left: -15px; } .product_list2 { padding-top: 20px; } .product_img { padding-left: 15px; padding-right: 15px; min-height: 340px; } .product_img img { margin-top: 15px; margin-right: auto; margin-left: auto; display: block; max-height: 300px; max-width: 100%; height: auto; margin-bottom: 10px; padding: 0px 0px 0px 0px; } .product_list2 div.product_img { min-height: 340px; } .product_title { text-align: center; height: 40px; } .product_head { margin-top: 40px; background: url(../images/product_head.jpg) center top no-repeat; } .product_head h2 { text-align: center; padding-top: 16px; font-size: 28px; color: #3f3f3f; } .product_list { clear: both; padding: 25px 0px 0px 0px; margin-right: -15px; margin-left: -15px; } .product_list2 { padding-top: 20px; } .product_img { padding-left: 15px; padding-right: 15px; min-height: 340px; } .product_img img { margin-right: auto; margin-left: auto; display: block; max-height: 300px; max-width: 100%; height: auto; margin-bottom: 10px; padding: 0px 0px 0px 0px; } .product_list2 div.product_img { min-height: 340px; } .product_title { text-align: center; height: 40px; } .product_head { margin-top: 40px; background: url(../Img/product_head.jpg) center top no-repeat; } .product_head h2 { text-align: center; padding-top: 16px; font-size: 28px; color: #3f3f3f; } .product_list { clear: both; padding: 25px 0px 0px 0px; margin-right: -15px; margin-left: -15px; } .product_list2 { padding-top: 20px; } .product_img { padding-left: 15px; padding-right: 15px; min-height: 340px; } .product_img img { margin-right: auto; margin-left: auto; display: block; max-height: 300px; max-width: 100%; height: auto; margin-bottom: 10px; padding: 0px 0px 0px 0px; } .product_list2 div.product_img { min-height: 340px; } .product_title { text-align: center; height: 40px; } .product_head { margin-top: 40px; background: url(../images/product_head.jpg) center top no-repeat; } .product_head h2 { text-align: center; padding-top: 16px; font-size: 28px; color: #3f3f3f; } .product_list { clear: both; padding: 25px 0px 0px 0px; margin-right: -15px; margin-left: -15px; } .product_list2 { padding-top: 20px; } .product_img { padding-left: 15px; padding-right: 15px; min-height: 340px; } .product_img img { margin-right: auto; margin-left: auto; display: block; max-height: 300px; max-width: 100%; height: auto; margin-bottom: 10px; padding: 0px 0px 0px 0px; } .product_list2 div.product_img { min-height: 340px; } .product_title { text-align: center; height: 40px; } .product_head { margin-top: 40px; background: url(../images/product_head.jpg) center top no-repeat; } .product_head h2 { text-align: center; padding-top: 16px; font-size: 28px; color: #3f3f3f; } .product_list { clear: both; padding: 25px 0px 0px 0px; /* margin-right: 15px;*/ margin-left: 15px;/*左*/ } .product_list2 { padding-top: 20px; } .product_img { padding-left: 15px; padding-right: 15px; min-height: 340px; } .product_img img { margin-right: auto; margin-left: auto; display: block; max-height: 300px; max-width: 100%; height: auto; margin-bottom: 10px; padding: 0px 0px 0px 0px; } .product_list2 div.product_img { min-height: 340px; /* background-color: #e5dede; */ } .product_title { text-align: center; height: 40px; } #recordLink{ text-decoration:none; color: #FFFFFF; } #recordLink:hover{ text-decoration:none; color: #FFFFFF; } .dropdown-menu li a{ color: #FFFFFF!important; } @media screen and (min-width: 1200px) { .logo{ margin: 0px 0px 0px 0px; max-width: 330px; max-height: 80px; } .navbar{ margin: 0px; border: 0px; background: #1b1b1b; min-height: 80px; } .navbar-nav > li > a{ text-align: center; font-size: 16px;/*主导航字体大小*/ } .navbar-default .navbar-nav > li > a{ color:#fff; padding-top: 30px; padding-bottom: 30px; } .container{ width: 1170px; } .navbar-nav { float: right; } /*子导航移上标签悬停颜色*/ .navbar .nav > li:hover .dropdown-menu { display: block; background: #ff0000; } /*主导航移上标签悬停颜色*/ .navbar .nav li a:hover{ background: #ff0000;/*移上主菜单颜色*/ color: white; } .dropdown-menu a:hover{ background: #1b1b1b!important;/*移上子菜单颜色*/ color: white; } .header_dfl_left_news li a { width:15em;/*控制右边列表的宽度*/ } /*点击后加一条线*/ .navbar .nav li a:focus{ text-decoration: none } .navbar .nav li a:focus:after{ content: ""; width: 40px; border-radius: 4px; height: 4px; text-align: center; background-color: #fff; position: absolute; bottom: 5px; left: 24px } /*列表页-横幅*/ .page_bg { /*background-size:100% 100%!important;*/ } .center_tel { height: 550px; background-position: center center; } } @media screen and (min-width: 960px) and (max-width: 1199px) { .logo{ margin: 0px 0px 0px 0px; max-width: 330px; max-height: 80px; } .navbar{ margin: 0px; border: 0px; background: #1b1b1b; min-height: 80px; } .navbar-nav > li > a{ text-align: center; } .navbar-default .navbar-nav > li > a{ color:#fff; padding-top: 30px; padding-bottom: 30px; } .container{ width: 970px; } .navbar-nav { float: right; } /*子导航移上标签悬停颜色*/ .navbar .nav > li:hover .dropdown-menu { display: block; background: red; } /*主导航移上标签悬停颜色*/ .navbar .nav li a:hover{ background: #1b1b1b; color: white; } /*点击后加一条线*/ .navbar .nav li a:focus{ text-decoration: none } .navbar .nav li a:focus:after{ content: ""; width: 40px; border-radius: 4px; height: 4px; text-align: center; background-color: #fff; position: absolute; bottom: 5px; left: 24px } .header_dfl_left_news li a { width:15em;/*控制右边列表的宽度*/ } } @media screen and (min-width: 768px)and (max-width: 959px){ .logo{ margin: 0px 0px 0px 0px; max-width: 330px; max-height: 80px; } .navbar{ margin: 0px; border: 0px; background: #1b1b1b; min-height: 80px; } .navbar-nav > li > a{ text-align: center; } .navbar-default .navbar-nav > li > a{ color:#fff; padding-top: 30px; padding-bottom: 30px; } .navbar-nav { float: right; } /*子导航移上标签悬停颜色*/ .navbar .nav > li:hover .dropdown-menu { display: block; background: red; } /*主导航移上标签悬停颜色*/ .navbar .nav li a:hover{ background: #ff0000; color: white; } .dropdown-menu:hover{ background: #1b1b1b; color: white; } .navbar .nav li a:focus:after{ content: ""; width: 40px; border-radius: 4px; height: 4px; text-align: center; background-color: #fff; position: absolute; bottom: 5px; left: 24px } } /*小屏*/ @media screen and (max-width: 767px) { .logo { margin: 0px 0px 0px 0px; max-width: 330px; max-height: 80px; } .navbar { margin: 0px; border: 0px; background: #1b1b1b; min-height: 80px; } .navbar-header { min-height: 80px; } .navbar-nav > li > a { /*text-align: center;*/ } .navbar .nav > li:hover .dropdown-menu { display: block; /*background: red;*/ color: white; } /*主导航移上标签悬停颜色*/ .navbar .nav li a:hover{ background: black; color: white; } .navbar-default .navbar-nav > li > a { color: #fff; padding-top: 10px; padding-bottom: 10px; } .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } /*橫幅隐*/ /* .bread_bg { margin-top: 50px; } .page_bg, .left_nav { display: none; } */ } .navbar .nav > li .dropdown-menu { margin: 0px; } /*新闻资讯*/ /*内容*/ .swiper-container { margin: 0 auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; } .swiper-slide { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 100%; height: 100%; position: relative; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; -o-transition-property: transform; transition-property: transform; transition-property: transform, -webkit-transform; } /**/ .swiper-container { margin: 0 auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; } .list-3 { margin: -20px 0 0 -20px; border: 0px solid red !important; } .list-3 li { float: left; width: 50%; } .list-3 li a { display: block; margin: 20px 0 0 20px; background-color: #fff; padding: 20px; -webkit-transition: all .5s; transition: all .5s; overflow: hidden; position: relative; } .list-3 li .date { float: left; width: 115px; position: relative; z-index: 1; line-height: 1; padding: 5px 0; color: #fff; } .list-3 li .date small { display: block; font-size: 16px; } small { font-size: 80%; } .list-3 li .date strong { display: block; font-size: 48px; margin-top: 10px; } b, strong { font-weight: bolder; } /*strong变成一条线*/ .section-title strong:after { position: absolute; right: 0; top: 50%; height: 1px; width: 86%; content: ""; background: #e5e5e5; } .list-3 li .text { margin-left: 140px; } .list-3 li .text h4 { margin: 0; font-weight: 400; font-size: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .list-3 li .text p { margin: 10px 0 0; color: #666; -webkit-transition: all .5s; transition: all .5s; line-height: 1.8; height: 50px; font-size: 14px; overflow: hidden; } /*三角形LI*/ .list-3 li a:after { position: absolute; left: 0; top: 0; content: ""; width: 150px; height: 0; border-bottom: 125px solid #dfdfdf; border-right: 78px solid transparent; -webkit-transition: all .5s; transition: all .5s; } .clearfix:before, .clearfix:after { display: table; line-height: 0; content: ""; } .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; -o-transition-property: transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-box-sizing: content-box; box-sizing: content-box; } .swiper-container-android .swiper-slide, .swiper-wrapper { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) } @keyframes fadeInUp { 0% { opacity:0; -webkit-transform:translate3d(0, 100%, 0); transform:translate3d(0, 100%, 0) } to { opacity: 1; -webkit-transform: translateZ(0); transform: translateZ(0) } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp } /*内容变灰*/ .list-3 li a:hover{background-color:#3a4249;color:#fff} /*日期变蓝*/ .list-3 li a:hover:after{border-bottom-color:#104492} /*p内容变成白色*/ .list-3 li a:hover .text p{color:#fff} .list-3 li[data-v-37a09d7d] { float: left; width: 50%; border: 0px solid red; } @media screen and (max-width: 768px){ .list-3 li { float: left; width: 100%; } }