/*产品Css*/ .right_content .detail_ul{ width:100%; overflow:hidden; } .my-container{ position:absolute; top:0; left:310px; } .right_content .detail_ul .dateil_font{ float:left; margin-left:20px; padding:10px 0 0 50px; width:470px; height:400px; border-left:1px solid #d1d1d1; box-sizing:border-box; } .right_content .detail_ul .dateil_font .right_title{ font-size:26px; font-weight:600; margin-bottom:20px; } .right_content .detail_ul .dateil_font p{ margin-top:15px; font-size:14px; line-height:26px; color:#333; border-bottom: 1px solid #d1d1d1; padding-bottom: 5px; } .right_content .detail_ul .dateil_font p.description{ margin-top:10px; display: -webkit-box; /*值必须为-webkit-box或者-webkit-inline-box*/ -webkit-box-orient: vertical; /*值必须为vertical*/ -webkit-line-clamp: 3; /*值为数字,表示一共显示几行*/ overflow: hidden; } .divide{ padding:0; overflow:hidden; } .divide a{ display: block; width:120px; font-size:16px !important; line-height:50px; text-align:center; color:#333; border-right:1px solid #dedede; float:left; } .divide a:hover, .divide a.cur{ background-color:#333; color:#fff; } .detail_content div{ display:none; font-size:16px; line-height:26px; color:rgb(63, 63, 63); } .detail_content div p{ margin-top:15px; } .detail_content div p img{ max-width:100%; width:auto !important; height:auto !important; } .detail_content div.cur{ display:block; } #magnifier{ float:left; position: relative; width:400px; } #magnifier .tar_img_border{ width:100%; height:400px; margin-bottom: 20px; border:1px solid #d1d1d1; position:relative; } #magnifier .tar_img_border .hover{ display: none; position: absolute; left: 0; top: 0; width: 200px; height: 200px; border: 1px solid #aaa; background: #0099ff; opacity: .5; filter: alpha(opacity: 50); cursor: move; } #magnifier .tar_img_border .img{ display: block; max-width:100%; max-height:100%; position:absolute; top:0; left:0; bottom:0; right:0; margin:auto; } #magnifier .thumbnail-box{ width:100%; position: relative; } #magnifier .thumbnail-box .list{ overflow: hidden; width:88%; margin: 0 auto; } #magnifier .thumbnail-box .btn-prev{ position: absolute; top: 50%; width: 22px; height: 32px; margin-top: -16px; left: 0; background: url(/statics/images/tem/btn_prev.png) no-repeat; } #magnifier .thumbnail-box .btn-next{ position: absolute; top: 50%; width: 22px; height: 32px; margin-top: -16px; right: 0; background: url(/statics/images/tem/btn_next.png) no-repeat; } #magnifier .thumbnail-box .list .wrapper{ width: 100000px; } #magnifier .thumbnail-box .list .wrapper .item{ width:50px; height:50px; float:left; margin:0 10px; border: 2px solid #fff; } #magnifier .thumbnail-box .list .wrapper .item-cur{ border: 2px solid #e53e41; } #magnifier .thumbnail-box .list .wrapper .item img{ width:100%; height:100%; } .big-box{ display:none; overflow: hidden; position: absolute; left: 420px; top: 0; width: 470px; height: 470px; border: 1px solid #e4e4e4; } .big-box img { display: block; }