diff --git a/css/common.css b/css/common.css index 9a2d8f7..1a01778 100644 --- a/css/common.css +++ b/css/common.css @@ -15,6 +15,7 @@ body { max-width: 750px; margin: 0 auto; font-size: 0.14rem; + line-height: 1.5; color: #262626; } diff --git a/css/style.css b/css/style.css index 2e13047..3f652e8 100644 --- a/css/style.css +++ b/css/style.css @@ -1,4 +1,4 @@ -.header{ +.header { align-items: center; width: 7.5rem; height: .94rem; @@ -10,16 +10,19 @@ z-index: 999; transform: translateX(-50%); } -.header-back{ + +.header-back { justify-content: center; width: .6rem; height: .4rem; } -.header-back>img{ + +.header-back>img { width: .4rem; height: .4rem; } -.header-title{ + +.header-title { width: calc(100% - 1.2rem); line-height: 1.2; text-align: center; @@ -28,39 +31,48 @@ } /* 轮播图 */ -.banner{ +.banner { width: 100%; height: 3.64rem; margin-top: .94rem; overflow: hidden; } -.banner img{ + +.banner img { width: 100%; min-height: 3.64rem; } /* 首页内容区 */ -.index-content{ +.index-content { background-color: #fed7b0; padding: .45rem .2rem; border-top: .02rem solid #eeb94f; } /* 活动 */ -.index-activity{ +.index-content .section { + padding: .1rem; + background-image: linear-gradient(to top, #fec44b, #fff8b4); + position: relative; +} + +.section-box { flex-wrap: wrap; justify-content: space-between; - padding: .48rem .32rem; - border: .1rem solid #fff0a3; + width: 100%; + padding: .48rem .36rem; background-color: #ffffff; } -.envelopes{ + +.activity .envelopes { width: 2.8rem; height: 3.66rem; background-image: url(../images/envelopes.png); background-size: 100% 100%; } -.envelopes>span{ + +.activity .envelopes>span { display: block; font-size: .64rem; text-align: center; @@ -68,17 +80,51 @@ margin-top: 1.7rem; color: #ffebac; } -.envelopes>a{ + +.activity .envelopes>a { justify-content: center; align-items: center; width: calc(100% - .52rem); height: .58rem; - background-image: linear-gradient(to top,#fed383,#fdf0c2); + background-image: linear-gradient(to top, #fed383, #fdf0c2); margin: .15rem auto 0; color: #ec294c; + font-weight: bold; animation: scale_name 1s linear alternate infinite; } -@keyframes scale_name{ - from{transform: scale(.95);} - to{transform: scale(1.05);} -} \ No newline at end of file + +@keyframes scale_name { + from { + transform: scale(.95); + } + + to { + transform: scale(1.05); + } +} + +.activity .txt { + width: 100%; + line-height: 1.7; +} + +.activity .txt>p { + margin-top: .25rem; +} + +.recommend-title{ + justify-content: center; + align-items: center; + width: 3.2rem; + height: .88rem; + background-color: #ff353f; + border: .1rem solid #ffde77; + border-radius: .44rem; + color: #ffffff; + text-indent: .04rem; + letter-spacing: .04rem; + position: absolute; + left: 50%; + top: -0.49rem; + transform: translateX(-50%); +} diff --git a/index.html b/index.html index 91f5e7c..cbaf61c 100644 --- a/index.html +++ b/index.html @@ -53,14 +53,29 @@
-
-
- 17:00 - 立即开枪 +
+
+
+ 17:00 + 立即开抢 +
+
+ 18:00 + 立即开抢 +
+
+

活动时间:2022年8月31日-2022年9月1日

+

主办方:四川天府新区万安街道办事处

+

+ 活动介绍:
1:用户关注公众号才可以参与活动;
2:通过抽奖活动每人每天可以获得一张随机面额的消费券;
3:参与本次活动的万安商家,详见商家列表。 +

+
-
- 18:00 - 立即开枪 +
+
+
商家推荐
+
+