小草卤肉店/index.html · 约 3641 字符
1<!DOCTYPE html>
2<html lang="zh-CN">
3<head>
4<meta charset="UTF-8"/>
5<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"/>
6<title>首页 · 小草卤肉店</title>
7<link rel="stylesheet" href="style.css"/>
8</head>
9<body>
10
11<div class="banner">
12 <div>
13 <div class="bn-title">小草卤肉店</div>
14 <div class="bn-sub">秘制老汤卤味 · 当日现卤当日售<br/>招牌卤猪蹄限量 200 份 · 同城 1 小时达</div>
15 <div class="bn-badge">🔥 新人 15 元无门槛券 · 首单立减</div>
16 </div>
17 <div class="bn-emoji">🍖</div>
18</div>
19<div class="notice-bar">
20 <b>🕒 当日现卤公告</b><br/>
21 每日 10:00 / 16:00 两炉现卤，售完即止 · 卤味均 0 防腐剂 0 色素 · 真空包装锁鲜 7 天 · 不满意包退
22</div>
23<div class="quick-grid">
24 <a href="category.html"><div class="qicon">🍖</div>卤肉</a>
25 <a href="category.html"><div class="qicon">🍗</div>卤禽</a>
26 <a href="category.html"><div class="qicon">🥗</div>素菜凉拌</a>
27 <a href="category.html"><div class="qicon">🎁</div>卤味礼盒</a>
28 <a href="vip.html"><div class="qicon">👑</div>会员储值</a>
29 <a href="flash.html"><div class="qicon">⚡</div>秒杀拼团</a>
30 <a data-toast="附近门店 8 家"><div class="qicon">🏪</div>门店自提</a>
31 <a data-toast="企业福利采购热线 400-880-6666"><div class="qicon">🏢</div>企业团购</a>
32</div>
33<div class="coupon-card">
34 <div class="cc-left"><b>新人礼 15 元无门槛券</b><span>首单立减 · 7 天内有效</span></div>
35 <div class="cc-btn">立即领取</div>
36</div>
37<div class="section-title">🔥 今日现卤爆款 <span>月售 10 万+ ›</span></div>
38<div id="hotList"></div>
39<div class="section-title">👑 会员储值 · 充值有礼</div>
40<div class="card" style="margin-top:0;font-size:12px;color:#6b4636;line-height:2">
41 💰 会员价全品 9 折 · 每周三会员日 8 折<br/>
42 🎁 充 100 送 15 / 充 200 送 40 / 充 500 送 120 券包<br/>
43 🎂 生日送招牌卤猪蹄 1 只 + 20 元券
44</div>
45<div class="section-title">⚡ 限时秒杀 · 9.9 起</div>
46<div class="card" style="margin-top:0;font-size:12px;color:#6b4636;line-height:2">
47 🌶️ 麻辣卤鸡爪 ¥9.9（原 32）· 🥩 卤牛肉 ¥49.9（原 68）<br/>
48 🦆 卤鸭脖 ¥6.6（原 12.9）· 每日 11:00 / 20:00 两场开抢
49</div>
50
51
52<nav class="tabbar"><a class=" active" href="index.html"><span class="icon">🏠</span>首页</a><a class="" href="category.html"><span class="icon">🍖</span>卤味</a><a class="" href="vip.html"><span class="icon">👑</span>会员</a><a class="" href="orders.html"><span class="icon">📦</span>订单</a><a class="" href="mine.html"><span class="icon">👤</span>我的</a></nav>
53<script src="data.js"></script>
54<script>
55 var hl = document.getElementById('hotList');
56 var h = '';
57 window.DATA.meats.filter(function (m) { return m.hot; }).slice(0, 3).forEach(function (m) {
58 h += '<div class="meat-card"><div class="mc-img">' + m.img + '</div><div class="mc-body">'
59 + '<div class="mc-name">' + m.name + ' <span class="badge badge-hot">热销</span></div>'
60 + '<div class="mc-desc">' + m.desc + '</div>'
61 + '<div class="mc-meta">月售 ' + m.sales.toLocaleString() + '+ · ' + m.tags.join(' · ') + '</div>'
62 + '<div class="mc-foot"><div class="mc-price">¥' + m.price + '<small> /原' + m.old + '</small></div>'
63 + '<div class="mc-btn">立即下单</div></div></div></div>';
64 });
65 hl.innerHTML = h;
66</script>
67<script src="app.js"></script>
68</body>
69</html>