首页布局样式修改

css/style.css

@@ -85,22 +85,29 @@
 .section-box {
 	flex-wrap: wrap;
 	width: 100%;
-	padding: .48rem .36rem;
 	background-color: #ffffff;
 }
 
-.activity {
+.index-content .section:nth-of-type(1) .section-box,
+.index-content .section:nth-of-type(2) .section-box{
+	padding: .62rem .36rem .3rem;
+}
+.index-content .section:nth-of-type(3) .section-box{
+	padding: .48rem .36rem;
+}
+
+.activity-time {
 	justify-content: space-between;
 }
 
-.activity .envelopes {
+.activity-time .envelopes {
 	width: 2.8rem;
 	height: 3.66rem;
 	background-image: url(../images/envelopes.png);
 	background-size: 100% 100%;
 }
 
-.activity .envelopes>span {
+.activity-time .envelopes>span {
 	display: block;
 	font-size: .64rem;
 	text-align: center;
@@ -109,7 +116,7 @@
 	color: #ffebac;
 }
 
-.activity .envelopes>p {
+.activity-time .envelopes>p {
 	justify-content: center;
 	align-items: center;
 	width: calc(100% - .52rem);
@@ -131,13 +138,18 @@
 	}
 }
 
-.activity .txt {
+.activity-info .txt {
 	width: 100%;
 	line-height: 1.7;
 }
 
-.activity .txt>p {
+.activity-info .survey>p{
-	margin-top: .25rem;
+	line-height: 3;
+}
+
+.activity-info .introduce{
+	line-height: 1.68;
+	margin-top: .1rem;
 }
 
 /* 商家推荐 */

user/index.html

@@ -35,9 +35,10 @@
 		</div>
 		<!-- 内容区 -->
 		<div class="index-content border-box">
-			<!-- 活动 -->
+			<!-- 活动时间 -->
-			<div class="section radius50 border-box">
+			<div class="section radius50 border-box" style="margin-top: .34rem;">
-				<div class="section-box activity radius40 border-box flex">
+				<div class="recommend-title font38 color-ff border-box flex">活动时间</div>
+				<div class="section-box activity-time radius40 border-box flex">
 					<a href="luck-draw.html" class="envelopes">
 						<span>17:00</span>
 						<p class="font26 radius20 flex">立即开抢</p>
@@ -46,17 +47,34 @@
 						<span>18:00</span>
 						<p class="font26 radius20 flex">立即开抢</p>
 					</a>
-					<div class="txt font30">
+				</div>
-						<p><strong>活动时间：</strong>2022年8月31日-2022年9月1日</p>
+			</div>
-						<p><strong>主办方：</strong>四川天府新区万安街道办事处</p>
+			<!-- 活动介绍 -->
-						<p>
+			<div class="section radius50 border-box" style="margin-top: .8rem;">
-							<strong>活动介绍：</strong><br />
							1：用户关注公众号才可以参与活动；<br />
							2：通过抽奖活动每人每天可以获得一张随机面额的消费券；<br />
							3：参与本次活动的万安商家，详见商家列表。
+				<div class="recommend-title font38 color-ff border-box flex">活动介绍</div>
-						</p>
+				<div class="section-box activity-info radius40 border-box flex">
+					<div class="txt">
+						<div class="survey font24">
+							<p><strong>活动时间：</strong>2022年8月31日-2022年9月1日</p>
+							<p><strong>主办方：</strong>四川天府新区万安街道办事处</p>
+						</div>
+						<div class="introduce font30">
+							<p>
+								<span class="radius20 background-f35 flex" style="justify-content: center;align-items:center;height: .62rem; margin-bottom: .2rem;">消费券领取及兑换规则 </span>
+								1.抢券时间为5天  上午开抢时间上午10：00整和下午15：00整。<br />
+								2.每天发放20元面值20张、30元面值40张、50元面值40张、80元面值30张、100元面值20张，此券拆分上午和下午准时定点发放。<br />
+								3.消费券每人每天可参加一次抽奖活动领取。
+							</p>
+							<p style="margin-top: .3rem;">
+								<span class="radius20 background-f35 flex" style="justify-content: center;align-items:center;height: .62rem; margin-bottom: .2rem;">消费券使用规则</span>
+								1.使用此券可与店内活动同享。<br />
								2.此券在活动期内使用，如未在活动期内使用视为作废。<br />
								3.此消费券不找零，不兑换现金。<br />
								4.消费券可叠加使用。
+							</p>
+						</div>
 					</div>
 				</div>
 			</div>
 			<!-- 商家推荐 -->
-			<div class="section radius50 border-box" style="margin-top: .76rem;">
+			<div class="section radius50 border-box" style="margin-top: .8rem;">
 				<div class="recommend-title font38 color-ff border-box flex">商家推荐</div>
 				<div class="section-box recommend radius40 border-box flex">
 					<a class="item" href="detail.html">