From 9172fbb3e80a7c3b79fc5a1d074d69fa58c72d73 Mon Sep 17 00:00:00 2001
From: Lee <342694918@qq.com>
Date: Mon, 20 Dec 2021 15:41:47 +0800
Subject: [PATCH] lee

---
 css/base.css  |  29 +++----
 css/style.css | 204 +++++++++++++++++++++++++++++++++++++++++++++++---
 2 files changed, 203 insertions(+), 30 deletions(-)

diff --git a/css/base.css b/css/base.css
index 215fa74..76110b9 100644
--- a/css/base.css
+++ b/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;}
diff --git a/css/style.css b/css/style.css
index 85ce354..8d2b4a3 100644
--- a/css/style.css
+++ b/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;
+	}
+}
+