consumer-coupon/index.html

122 lines
4.3 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>万安优惠券</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<!-- css加载 -->
<link rel="stylesheet" href="css/common.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/swiper-bundle.min.css">
<!-- js加载 -->
<script src="js/jquery-3.6.1.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/base.js" type="text/javascript" charset="utf-8"></script>
<script src="js/script.js" type="text/javascript" charset="utf-8"></script>
<script src="js/swiper-bundle.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<!-- 头部 -->
<div class="header flex">
<div class="header-back flex" onclick="window.history.go(-1)">
<img src="images/icon/icon-back.png" alt="返回">
</div>
<div class="header-title font38">活动领券</div>
</div>
<!-- 轮播图 -->
<div class="banner">
<div class="banner-swiper swiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<img src="images/banner.jpg" alt="轮播图">
</div>
<div class="swiper-slide">
<img src="images/banner.jpg" alt="轮播图">
</div>
<div class="swiper-slide">
<img src="images/banner.jpg" alt="轮播图">
</div>
</div>
</div>
</div>
<script type="text/javascript">
var bannerSwiper = new Swiper('.banner-swiper', {
loop:true,//开启循环播放
autoplay: {//开启自动播放
delay:3000,
disableOnInteraction: false,//触摸后不会停止自动滚动
pauseOnMouseEnter: true,//鼠标置于swiper时暂停自动切换鼠标离开时恢复自动切换。
}
})
</script>
<!-- 内容区 -->
<div class="index-content border-box">
<!-- 活动 -->
<div class="section radius50 border-box">
<div class="section-box activity radius40 border-box flex">
<div class="envelopes">
<span>17:00</span>
<a href="" class="font26 radius20 flex">立即开抢</a>
</div>
<div class="envelopes">
<span>18:00</span>
<a href="" class="font26 radius20 flex">立即开抢</a>
</div>
<div class="txt font30">
<p><strong>活动时间:</strong>2022年8月31日-2022年9月1日</p>
<p><strong>主办方:</strong>四川天府新区万安街道办事处</p>
<p>
<strong>活动介绍:</strong><br />
1用户关注公众号才可以参与活动<br />
2通过抽奖活动每人每天可以获得一张随机面额的消费券<br />
3参与本次活动的万安商家详见商家列表。
</p>
</div>
</div>
</div>
<!-- 商家推荐 -->
<div class="section radius50 border-box" style="margin-top: .76rem;">
<div class="recommend-title font38 border-box flex">商家推荐</div>
<div class="section-box recommend radius40 border-box flex">
<a class="item" href="">
<div class="img radius25">
<img src="images/recommend.jpg" alt="商家">
</div>
<div class="txt font24">周大福</div>
</a>
<a class="item" href="">
<div class="img radius25">
<img src="images/recommend.jpg" alt="商家">
</div>
<div class="txt font24">周大福</div>
</a>
<a class="item" href="">
<div class="img radius25">
<img src="images/recommend.jpg" alt="商家">
</div>
<div class="txt font24">周大福</div>
</a>
<a class="item" href="">
<div class="img radius25">
<img src="images/recommend.jpg" alt="商家">
</div>
<div class="txt font24">周大福</div>
</a>
<a class="item" href="">
<div class="img radius25">
<img src="images/recommend.jpg" alt="商家">
</div>
<div class="txt font24">周大福</div>
</a>
<a class="item" href="">
<div class="img radius25">
<img src="images/recommend.jpg" alt="商家">
</div>
<div class="txt font24">周大福</div>
</a>
</div>
</div>
</div>
<div class="footer">
尾部信息
</div>
</body>
</html>