/*常用变量*/ @link-color:#428bca; @link-color-hover:darken(@link-color, 10%); @font-family:"宋体", Arial, Helvetica, sans-serif,Arial,Verdana,Tahoma!important; @body-width:1000px; @font-size:12px; @color:#e0034f; @border:1px solid @border-color; @border-color:#dadada; @head-height:110px; @font-weight:700; /*常用变量*/ /*常用自定义部分css*/ body{margin: 0px;padding: 0px;border: 0;font-family:@font-family;font-size:@font-size; color: #333333} *{padding: 0px;margin: 0px;} a:hover{color: @color;} a{color: #666666} .wrap{width: 100%;height: 100%;} .head{width: 100%;height:@head-height; } .container{width: @body-width;height:100%;margin: 0 auto;padding-left: 0px;padding-right: 0px;} .middle{width: 100%;height: auto;} .footer{width: 100%;height: auto;} .pull_right{float: right} .pull_left{float: left} .clearfix{clear: both} .bold{font-weight:700} .c_3{color: #333333} .c_6{color: #666666} .c_9{color: #999999} .fs_12{font-size: 12px} .fs_14{font-size: 14px} .fs_16{font-size: 16px} .fs_18{font-size: 18px} .ml_10{margin-left: 10px;} .mr_10{margin-right: 10px;} .ml_20{margin-left: 20px;} .mr_20{margin-right: 20px;} .mc{margin: 0 auto} .current{color: @color} /*常用自定义部分css*/ /*头部部分*/ .head .container { .logo{width: 534px;height: 110px;background: url(../images/logo.png) no-repeat} .top_right{width: 400px;height: 110px;text-align: right;padding: 20px 0px; p{height:30px;margin-bottom: 10px;} span:hover{color: @color} } .nav{background-color: @color;height: 40px; ul li{list-style-type: none;width: 120px;text-align: center;color: #ffffff;font-weight: 700;line-height: 40px;height: 40px; a{color: #ffffff;} &:hover{ a{color: @color} background-color: #333333;color: @color} } ul li ul{display: none;z-index: 999;position: absolute;background-color: #333333} ul li:hover{cursor: pointer; >ul{display: block; >li{color: @color}; } } >ul >li{float: left; >ul a{text-decoration: none}; } >ul >a{float: left;text-decoration: none} } } /*头部部分*/ /*首页主体部分*/ .index .middle .container{ .border_cp{border: 1px solid @border-color;border-top:4px solid @border-color} .p{color:@color;font-weight: 700;font-size: 14px;float: left}; .padding_10{padding: 10px;} .index_news_box{width: 320px;height: 250px; >p{.p}; padding-right: 10px; .index_news{height:100%;.border_cp;.padding_10;overflow: hidden; >img{float: left;width: 95px;height: 70px;display: inline-block} .news_tr1{width: 180px;overflow: hidden; p a:first-child{display:block;width: 190px;overflow: hidden;white-space: nowrap;text-overflow:ellipsis;} p:last-child{width: 180px;height:50px;} } .news{height: 140px;overflow: hidden; ul li{list-style-type: none; margin-bottom:7px;} } a{display:block;width:280px;overflow: hidden;white-space: nowrap;text-overflow:ellipsis;} }; } .index_company_box{ >p{.p}; padding-left: 10px;padding-right: 10px; .index_company{width: 450px;height: 250px;.border_cp;.padding_10; >img{float: left;width: 150px;height: 115px;display: inline-block;margin-right: 10px;} } } .index_contact_box{ padding-left: 10px; >p{.p}; .index_contact{width: 190px;height: 250px;.border_cp;.padding_10} } .index_product{width: 100%;height: 255px;margin-top: 30px;margin-bottom: 30px; .tab{width: 120px;line-height: 30px;height: 30px;background-color: @color; text-align: center;color: #ffffff;font-weight: 700px;border-top-left-radius: 3px; border-top-right-radius: 3px; } .product_box{border: 1px solid @border-color;width: 100%;height: 225px;padding:10px; .product{border: 1px solid @border-color;width: 175px;height: 175px;float: left;margin-right:10px;margin-left: 10px;} } } } /*首页主体部分*/ /*内页部分*/ .introduce, .honor, .product, .product_list, .product_item, .news, .renli, .contact, .equipment .middle .container{ .middle_box{padding:20px;margin-top: 20px;margin-bottom:30px;width: 100%;height:auto;border: @border; .left_tab{width: 200px;height: 100%;float: left;border-radius: 4px; .tab_head{width: 100%;height: 40px;line-height: 40px;background:url('../images/table_th_bg.gif'); color: @color;font-weight:700;text-align: left;padding-left: 20px;border: @border;border-bottom: 0;} ul li { ul{display: none; li {display:block;list-style-type: none;border-bottom: 0px;padding-left: 30px;height: 40px;width: 100%;}} &:hover{ul{display: block}} } > ul{width: 100%;height: auto;border: @border;margin-bottom: 30px; > li{list-style-type: none;height: 40px;width: 100%;text-align: left;padding-left: 30px;line-height: 40px;border-bottom: @border; &:last-child{border-bottom: 0; } } } .contact{padding: 10px; p{margin-bottom: 5px;} p:first-child{font-size: 16px;color: #333333;font-weight:700;margin-bottom: 10px;} img{width: 180px;height: 80px;overflow: hidden;margin-top: 20px;} } } .right_content{ float: right;width: 720px;height: auto; > img:first-child{width: 720px;height:100px;overflow: hidden;margin-bottom: 20px; } >p{margin-bottom: 20px} .article{ img{float: left;display: inline-block;width: 228px;height: 288px;} p{float: right;width: 480px;line-height: 22px;} } .product_list .product_box{ float: left;border: @border;width: 195px;height: 245px;margin-left: 20px;margin-right:20px;margin-bottom: 40px; div{text-align:center;line-height:35px;color:@color;font-weight:@font-weight;font-size:12px;width: 100%;height: 35px; background-color: #000000;position: relative;bottom:32px;opacity:.7;-khtml-opacity: .7; -moz-opacity: 0.7} img{width: 190px;height: 240px;overflow: hidden} } .product_list_1 .product_box_1{ width: 340px;height:auto;float: left;border: @border;padding:5px;margin-right: 15px;margin-bottom: 15px; img{width: 120px;height: 150px;overflow: hidden;float: left;display: inline-block;} div{width: 180px;height: 120px;overflow: hidden;float: right; p:first-child{font-weight: @font-weight;color: #333333} } } .product_list_3 .product_box_3{ width: 320px;height: 340px;border: @border;padding: 5px;overflow: hidden;float: left;margin-right: 40px;margin-bottom: 30px; img{width: 300px;height: 240px;} .wp{font-weight: @font-weight} .wp2{height: 50px;} a{color: @color} } .product_list_2 { .product_item_img{ width: 270px;height: auto;overflow: hidden;float: left;border: @border;padding:5px; img{width: 250px;height: 315px;overflow: hidden} } .product_item_name{ width: 385px;height: 300px;overflow: hidden;float: right; p:first-child{font-weight: @font-weight;color: @color;font-size: 16px;} } .product_item_content{width:90%;height: auto;margin-top: 20px; p:first-child{color: #333333;font-weight: @font-weight;font-size: 14px;} p{line-height: 1.5em} } } .news_center{ ul li{ height:25px;margin-bottom: 10px;border-bottom: 1px dashed #dadada; .n1{float: left;} .n2{float: right} } } .news_detail{ h4{color: #000000;text-align: center} .n2{text-align: center} p{text-align: left;line-height: 1.8em} } .renli_table table{ width: 720px;border:1px solid #c8c8c8;border-bottom:1px solid #c8c8c8; tr{height: 30px;line-height: 40px;text-align: center; th{background:url('../images/table_th_bg.gif');text-align: center;border-left:1px solid #c8c8c8;border-top:1px solid #c8c8c8} td{border-left:1px solid #c8c8c8;border-top:1px solid #c8c8c8} } } .contact_content{ #allmap{width:400px;height:300px;float: left} .contact_item{width: 290px;float: right} } } } } /*内页部分*/ /*footer部分*/ .footer .container{ .footer_box{width: 100%;border-top: 2px solid @color;height: 80px;padding: 15px;text-align: center} } /*footer部分*/ /*幻灯片*/ .flexslider{position:relative;height:350px;margin-bottom:20px;overflow:hidden;background:url(../images/loading.gif) 50% no-repeat;} .slides{position:relative;z-index:1;} .slides li{height:350px;} .flex-control-nav{position:absolute;bottom:10px;z-index:2;width:100%;text-align:center;} .flex-control-nav li{display:inline-block;width:14px;height:14px;margin:0 5px;*display:inline;zoom:1;} .flex-control-nav a{display:inline-block;width:14px;height:14px;line-height:40px;overflow:hidden;background:url(../images/dot.png) right 0 no-repeat;cursor:pointer;} .flex-control-nav .flex-active{background-position:0 0;} .flex-direction-nav{position:absolute;z-index:3;width:100%;top:30%; li{float: left} } .flex-direction-nav li a{display:block;width:50px;height:50px;overflow:hidden;cursor:pointer;position:absolute;} .flex-direction-nav li a.flex-prev{left:40px;background:url(../images/prev.png) center center no-repeat;} .flex-direction-nav li a.flex-next{right:40px;background:url(../images/next.png) center center no-repeat;} /*幻灯片*/ /*底部产品轮播图*/ .ibox{width:1000px; height:220px;padding: 10px 10px; border:1px solid #ddd; position:relative; overflow:hidden} .ibox ul li{list-style-type: none} .ibox .showbox{position:absolute;left:0;width:2550px; height:190px;} .ibox .showbox ul li{float:left;margin:12px;width: 175px;height: 175px; border:1px solid #dadada} .ibox .showbox ul li img{width:170px; height:170px;} .ibox span{position:absolute; cursor:pointer;z-index: 999; } .ibox span.pre{left:10px;top:42%; background: url(../images/prev.png);width:50px;height: 50px;} .ibox span.next{right:10px;top:42%; background: url(../images/next.png);width:50px;height: 50px; } .ibox span.num{right:45%; bottom:0; background:#ddd;line-height:18px;} .ibox span.num li{display:inline;margin:0 10px; padding:1px 5px; line-height:18px} .ibox span.num .numcur{background:#a40000; color:#fff} /*底部产品轮播图*/