小草景区门票_H5/index.html · 约 3783 字符
1<!DOCTYPE html><html lang="zh-CN"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"><title>小草景区门票</title><link rel="stylesheet" href="style.css"></head><body>
2<div class="topbar">
3 <div class="tb-row"><span>📍</span><span class="tb-addr">杭州</span><span style="opacity:.8;font-size:11px">▾ 本周 86 个景区可预约</span></div>
4 <div class="tb-search" onclick="location.href='spots.html'"><span>🔍</span><span>搜索景区 / 城市 / 关键词…</span></div>
5</div>
6<div class="deal-card">
7 <span class="dc-emoji">🎁</span>
8 <div class="dc-body"><b>新客专享 · 首单立减10元</b>提前预约免排队 · 电子票扫码入园 · 未用可退</div>
9 <span style="background:#fff;padding:7px 14px;border-radius:16px;font-size:12px;font-weight:700;color:#7c3a12;white-space:nowrap">去逛逛 ›</span>
10</div>
11<div class="quick-grid">
12 <a href="spots.html"><span class="qicon">🏔️</span>山水自然</a>
13 <a href="spots.html"><span class="qicon">🏯</span>人文古迹</a>
14 <a href="spots.html"><span class="qicon">🎡</span>主题乐园</a>
15 <a href="tickets.html"><span class="qicon">🎫</span>我的票务</a>
16</div>
17<div class="section-title">热门景区 <span>本周热卖</span></div>
18<div id="hot-spots"></div>
19<div class="section-title">限时特惠 <span>提前购更划算</span></div>
20<div class="card" style="font-size:12px;color:#3d7a5f;line-height:2">
21 ⚡ 欢乐世界 夜场票 限时 ¥99（原价199）<br>🏔️ 云雾山 早鸟票 7折 · 仅限每日前100张<br>🎫 家庭套票 立省20元 · 周末通用
22</div>
23<div class="section-title">出行保障</div>
24<div class="card" style="display:flex;gap:10px;text-align:center">
25 <div style="flex:1"><div style="font-size:26px">🎫</div><div style="font-size:12px;font-weight:600">电子票</div><small style="color:#8aa896;font-size:10px">扫码入园</small></div>
26 <div style="flex:1"><div style="font-size:26px">↩️</div><div style="font-size:12px;font-weight:600">未用可退</div><small style="color:#8aa896;font-size:10px">秒到账</small></div>
27 <div style="flex:1"><div style="font-size:26px">⏰</div><div style="font-size:12px;font-weight:600">分时预约</div><small style="color:#8aa896;font-size:10px">免排队</small></div>
28 <div style="flex:1"><div style="font-size:26px">🛡️</div><div style="font-size:12px;font-weight:600">假票拦截</div><small style="color:#8aa896;font-size:10px">一码一票</small></div>
29</div>
30<div style="height:80px"></div>
31<div class="tabbar">
32 <a class="active" href="index.html"><span class="icon">🏠</span>首页</a>
33 <a href="spots.html"><span class="icon">🗺️</span>景区</a>
34 <a href="orders.html"><span class="icon">📋</span>订单</a>
35 <a href="tickets.html"><span class="icon">🎫</span>票务</a>
36 <a href="mine.html"><span class="icon">👤</span>我的</a>
37</div>
38<script src="data.js"></script><script src="app.js"></script>
39<script>
40$('#hot-spots').innerHTML=SPOTS.filter(s=>s.hot).slice(0,4).map(s=>`
41 <div class="spot-card" onclick="location.href='detail.html?id=${s.id}'">
42 <div class="sc-img">${s.emoji}</div>
43 <div class="sc-body">
44 <div class="sc-name">${s.name} <span style="color:var(--accent);font-size:12px">★ ${s.score}</span></div>
45 <div class="sc-tags">${s.tags.map(t=>'<span class="tag">'+t+'</span>').join('')}</div>
46 <div class="sc-meta">📍 ${s.city} · ${s.desc}</div>
47 <div class="sc-foot"><span class="sc-price"><em>¥</em>${s.price}<small style="font-size:10px;color:#8aa896">起</small></span><span class="sc-buy">订票</span></div>
48 </div>
49 </div>`).join('');
50</script>
51</body></html>