lee
parent
e43bb6d950
commit
9172fbb3e8
29
css/base.css
29
css/base.css
|
|
@ -24,8 +24,8 @@ i {
|
|||
}
|
||||
|
||||
/* 去掉li 的小圆点 */
|
||||
ul,
|
||||
ol,
|
||||
ul,
|
||||
ol,
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
|
|
@ -49,7 +49,7 @@ a {
|
|||
text-decoration: none;
|
||||
/* 手机端去除a标签点击时的背景样式 */
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
/* 去除边距 */
|
||||
/* 去除边距 */
|
||||
display: inline-block;
|
||||
}
|
||||
/* a:hover {
|
||||
|
|
@ -96,24 +96,17 @@ textarea {
|
|||
.logo h1 a {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.w100{ width: 100%; margin: auto;}
|
||||
}
|
||||
|
||||
.w100{ width: 100%; margin: auto;}
|
||||
.w1200{ width: 1280px; margin: auto;}
|
||||
|
||||
.clips1{
|
||||
/* 弹性伸缩盒子模型显示 */
|
||||
display: -webkit-box;
|
||||
/* 用省略号代替 */
|
||||
text-overflow: ellipsis;
|
||||
/* 设置或检索伸缩盒对象的子元素的排列方式 */
|
||||
-webkit-box-orient: vertical;
|
||||
/* 禁止数字和英文换行 */
|
||||
word-break: break-all;
|
||||
/* 限制在一个块元素显示的文本的行数 */
|
||||
-webkit-line-clamp: 1;
|
||||
/* 溢出隐藏 */
|
||||
overflow: hidden;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow:ellipsis;
|
||||
}
|
||||
.clips2{display: -webkit-box;-webkit-line-clamp: 2;word-break: break-all;overflow: hidden;text-overflow: ellipsis;-webkit-box-orient: vertical;}
|
||||
.clips3{display: -webkit-box;-webkit-line-clamp: 3;word-break: break-all;overflow: hidden;text-overflow: ellipsis;-webkit-box-orient: vertical;}
|
||||
|
|
|
|||
204
css/style.css
204
css/style.css
|
|
@ -473,6 +473,7 @@
|
|||
background: #FFFFFF;
|
||||
width: 48.28%;
|
||||
padding-bottom: 20px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.index-news .left span{
|
||||
|
|
@ -497,6 +498,28 @@
|
|||
font-size: 18px;
|
||||
opacity: 1;
|
||||
}
|
||||
.index-news .left .news-time{
|
||||
width: 82px;
|
||||
height: 82px;
|
||||
background-color: #e73f7c;
|
||||
text-align: center;
|
||||
color: #FFFFFF;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
}
|
||||
.index-news .left .news-time>strong{
|
||||
padding-top: 10px;
|
||||
display: block;
|
||||
font-size: 24px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
.index-news .left .news-time>em{
|
||||
display: block;
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
/* 右侧 */
|
||||
.index-news .right{
|
||||
width: 50%;
|
||||
|
|
@ -864,10 +887,17 @@
|
|||
}
|
||||
.memorabili-txt .swiper-slide{
|
||||
width: 46.6% !important;
|
||||
height: 255px;
|
||||
margin: 30px 0;
|
||||
padding: 0 0 50px;
|
||||
margin-left: -21.6%;
|
||||
opacity: 1;
|
||||
cursor: pointer;
|
||||
transition: all .6s;
|
||||
}
|
||||
.memorabili-txt .swiper-slide:nth-of-type(5){
|
||||
opacity: 0;
|
||||
transition: all .6s;
|
||||
}
|
||||
.memorabili-txt .swiper-slide strong{
|
||||
display: block;
|
||||
|
|
@ -1003,7 +1033,7 @@
|
|||
}
|
||||
.classify-list ul li .product-img{
|
||||
width: 50%;
|
||||
/* height: 480px; */
|
||||
height: 480px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.classify-list ul li .product-img a{
|
||||
|
|
@ -1024,7 +1054,9 @@
|
|||
/* font-family: "SourceHanSansCN-Regular"; */
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.classify-list ul li .product-txt>a{
|
||||
display: block;
|
||||
}
|
||||
.product-txt span,
|
||||
.product-detail-txt span{
|
||||
font-size: 18px;
|
||||
|
|
@ -1034,17 +1066,28 @@
|
|||
.product-detail-txt h3{
|
||||
font-size: 32px;
|
||||
line-height: 1.5;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow:ellipsis;
|
||||
}
|
||||
.product-txt h4,
|
||||
.product-detail-txt h4{
|
||||
font-size: 22px;
|
||||
line-height: 1.8;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow:ellipsis;
|
||||
}
|
||||
.product-txt p,
|
||||
.product-detail-txt p{
|
||||
font-size: 15px;
|
||||
line-height: 2;
|
||||
color: #585858;
|
||||
display: -webkit-box;-webkit-line-clamp: 2;word-break: break-all;overflow: hidden;text-overflow: ellipsis;-webkit-box-orient: vertical;
|
||||
}
|
||||
.product-txt em,
|
||||
.product-detail-txt em{
|
||||
|
|
@ -1205,6 +1248,11 @@
|
|||
}
|
||||
.idea>div{
|
||||
width: 50%;
|
||||
height: 426px;
|
||||
}
|
||||
.idea>div img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.idea .idea-content{
|
||||
padding: 30px;
|
||||
|
|
@ -1251,6 +1299,13 @@
|
|||
line-height: 70px;
|
||||
padding: 0 30px;
|
||||
}
|
||||
.join-list li .join-title h4{
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow:ellipsis;
|
||||
}
|
||||
.join-list li .join-title h4,
|
||||
.join-list li .join-title span{
|
||||
display: block;
|
||||
|
|
@ -1309,6 +1364,7 @@
|
|||
margin: 35px auto 65px;
|
||||
}
|
||||
|
||||
|
||||
.contact-left{
|
||||
width: 50%;
|
||||
}
|
||||
|
|
@ -1356,6 +1412,11 @@
|
|||
height: 500px;
|
||||
position: relative;
|
||||
}
|
||||
.product-swiper .swiper-slide{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #F4F5F6;
|
||||
}
|
||||
.product-swiper img{
|
||||
width: 100%;
|
||||
min-height: 100%;
|
||||
|
|
@ -1426,6 +1487,7 @@
|
|||
|
||||
.product-content .detail img{
|
||||
margin: 50px auto;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
/* 上下篇 */
|
||||
|
|
@ -1660,6 +1722,9 @@
|
|||
.pull-banner{
|
||||
height: 420px;
|
||||
}
|
||||
.product-swiper{
|
||||
height: 470px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width:1360px){
|
||||
|
|
@ -1708,6 +1773,12 @@
|
|||
.sub-nav dl dt>span p>a{
|
||||
line-height: 68px;
|
||||
}
|
||||
.classify-list ul li .product-img{
|
||||
height: 440px;
|
||||
}
|
||||
.product-swiper{
|
||||
height: 460px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width:1280px){
|
||||
|
|
@ -1811,6 +1882,12 @@
|
|||
.news-main .news-right .section .more{
|
||||
font-size: 14px;
|
||||
}
|
||||
.classify-list ul li .product-img{
|
||||
height: 425px;
|
||||
}
|
||||
.product-swiper{
|
||||
height: 450px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width:1200px){
|
||||
|
|
@ -1859,6 +1936,15 @@
|
|||
.sub-nav dl dt>span p>a{
|
||||
line-height: 64px;
|
||||
}
|
||||
.idea .idea-txt p{
|
||||
line-height: 1.8;
|
||||
}
|
||||
.classify-list ul li .product-img{
|
||||
height: 400px;
|
||||
}
|
||||
.product-swiper{
|
||||
height: 440px;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width:1080px){
|
||||
.classify-list ul li .product-txt{
|
||||
|
|
@ -1883,6 +1969,19 @@
|
|||
.sub-nav dl dt>span p>a{
|
||||
line-height: 62px;
|
||||
}
|
||||
.idea .idea-txt p{
|
||||
font-size: 13px;
|
||||
line-height: 2;
|
||||
}
|
||||
.join-list li .join-title{
|
||||
font-size: 15px;
|
||||
}
|
||||
.classify-list ul li .product-img{
|
||||
height: 350px;
|
||||
}
|
||||
.product-swiper{
|
||||
height: 430px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width:980px){
|
||||
|
|
@ -1915,7 +2014,48 @@
|
|||
.sub-nav dl dt>span p>a{
|
||||
line-height: 60px;
|
||||
}
|
||||
.idea .idea-txt p{
|
||||
font-size: 13px;
|
||||
}
|
||||
.classify-list ul li .product-img{
|
||||
height: 320px;
|
||||
}
|
||||
.product-swiper{
|
||||
height: 420px;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width:900px){
|
||||
.idea .idea-txt p{
|
||||
font-size: 12px;
|
||||
line-height: 2;
|
||||
}
|
||||
.join-list li .join-title{
|
||||
font-size: 14px;
|
||||
}
|
||||
.classify-list ul li .product-img{
|
||||
height: 280px;
|
||||
}
|
||||
.classify-list ul li .product-txt{
|
||||
height: 260px;
|
||||
}
|
||||
.product-txt h3, .product-detail-txt h3{
|
||||
font-size: 24px;
|
||||
}
|
||||
.product-txt h4, .product-detail-txt h4{
|
||||
font-size: 17px;
|
||||
}
|
||||
.product-txt em, .product-detail-txt em{
|
||||
margin: 10px 0;
|
||||
}
|
||||
.product-txt p, .product-detail-txt p{
|
||||
font-size: 14px;
|
||||
}
|
||||
.product-swiper{
|
||||
height: 410px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
@media screen and (max-width:768px){
|
||||
.w1200{
|
||||
|
|
@ -1966,13 +2106,13 @@
|
|||
.header-content .head-btn{ display: block; margin: 0;}
|
||||
.header-content .nav ul{ box-sizing: content-box; width: 100%; padding: 30vh 0; height: 40vh; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;}
|
||||
.header-content .nav ul li{ width: 100%; float: left; margin: auto; text-align: center;}
|
||||
.header-content .nav ul li a{ width: 100%; font-size: 18px; color: #FFFFFF; line-height: 35px; margin: 10px 0;}
|
||||
.header-content .nav ul li a{ width: 100%; font-size: 16px; color: #FFFFFF; line-height: 35px; margin: 10px 0;}
|
||||
.header-content .nav.active{ transform: translate(0,0); opacity: 1;}
|
||||
.header-content .nav ul li.active a{
|
||||
background-color: rgb(0,0,0,0);
|
||||
color: #E73F7C;
|
||||
font-weight: bold;
|
||||
font-size: 20px;
|
||||
font-size: 16px;
|
||||
}
|
||||
.header-content .sub-nav{
|
||||
display: none;
|
||||
|
|
@ -2047,7 +2187,6 @@
|
|||
height: auto;
|
||||
font-size: 13px;
|
||||
line-height: 28px;
|
||||
margin-top: -28px;
|
||||
background:none;
|
||||
color: #E73F7C;
|
||||
text-align: right;
|
||||
|
|
@ -2100,7 +2239,7 @@
|
|||
height: 80px;
|
||||
}
|
||||
.product-classify>li.active ins, .classify-item>li.active ins{
|
||||
opacity: 0;
|
||||
opacity: 1;
|
||||
}
|
||||
.index-product>.middle{
|
||||
margin: 20px 0;
|
||||
|
|
@ -2114,7 +2253,7 @@
|
|||
}
|
||||
.index-product .product-list .product-item .img{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
height: 230px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.index-product .product-list .product-item .img img{
|
||||
|
|
@ -2181,6 +2320,17 @@
|
|||
font-size: 13px;
|
||||
margin: 6px 0;
|
||||
}
|
||||
.index-news .left .news-time{
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
}
|
||||
.index-news .left .news-time>strong{
|
||||
font-size: 20px;
|
||||
padding-top: 3px;
|
||||
}
|
||||
.index-news .left .news-time>em{
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
/* 联系我们 */
|
||||
.index-contact-bg{
|
||||
|
|
@ -2401,7 +2551,7 @@
|
|||
overflow: hidden;
|
||||
}
|
||||
.classify-list ul li .product-img{
|
||||
/* height: 240px; */
|
||||
height: 240px;
|
||||
width: 100%;
|
||||
}
|
||||
.classify-list ul li .product-txt{
|
||||
|
|
@ -2441,7 +2591,7 @@
|
|||
margin: 15px 0;
|
||||
}
|
||||
.product-txt .more, .news-content ul>li .news-txt .more{
|
||||
display: none;
|
||||
display: none !important;
|
||||
width: 100px;
|
||||
line-height: 26px;
|
||||
background-color: #007EC0;
|
||||
|
|
@ -2468,7 +2618,7 @@
|
|||
}
|
||||
.product-swiper{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
height: 230px;
|
||||
}
|
||||
.product-detail-txt{
|
||||
margin: 15px 0;
|
||||
|
|
@ -2535,6 +2685,7 @@
|
|||
.news-content ul>li .news-txt h3{
|
||||
font-size: 13px;
|
||||
text-align: justify;
|
||||
display: -webkit-box;-webkit-line-clamp: 2;word-break: break-all;overflow: hidden;text-overflow: ellipsis;-webkit-box-orient: vertical;
|
||||
}
|
||||
.news-content ul>li .news-img{
|
||||
width: 120px;
|
||||
|
|
@ -2591,7 +2742,7 @@
|
|||
display: none;
|
||||
}
|
||||
.news-main .news-left h1{
|
||||
font-size: 22px;
|
||||
font-size: 20px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
.news-main .news-left .news-number{
|
||||
|
|
@ -2625,9 +2776,11 @@
|
|||
}
|
||||
.idea>div{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
.idea .idea-content{
|
||||
padding: 0;
|
||||
height: auto;
|
||||
}
|
||||
.idea .idea-content h3{
|
||||
font-size: 22px;
|
||||
|
|
@ -2650,10 +2803,13 @@
|
|||
}
|
||||
|
||||
.join-list li .join-title{
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
line-height: 40px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
.join-list li .join-title h4{
|
||||
max-width: 60%;
|
||||
}
|
||||
.join-list li .join-title h4, .join-list li .join-title span{
|
||||
width: auto;
|
||||
}
|
||||
|
|
@ -2697,6 +2853,30 @@
|
|||
min-height: auto;
|
||||
}
|
||||
}
|
||||
@media screen and (max-width:768px){
|
||||
.page-product>div .page-txt strong{
|
||||
font-size: 12px;
|
||||
}
|
||||
.page-product span img{
|
||||
height: 6px;
|
||||
}
|
||||
.sub-nav dl dt, .product-classify>li, .classify-item>li{
|
||||
width: 50%;
|
||||
}
|
||||
.index-product .product-list .product-items li.active{
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.index-product .product-list .product-item .img{
|
||||
height: 220px;
|
||||
}
|
||||
.product-swiper{
|
||||
height: 220px;
|
||||
}
|
||||
.news-main .news-left h1{
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue