小草洗鞋店/category.html · 约 2207 字符
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<header class="header"><span class="back"></span><h1>洗护服务</h1><span class="right">🔍</span></header>
12<div class="filter-tabs">
13 <div class="filter-tab sel">全部</div>
14 <div class="filter-tab">运动鞋</div>
15 <div class="filter-tab">靴子</div>
16 <div class="filter-tab">皮鞋</div>
17 <div class="filter-tab">球鞋修复</div>
18 <div class="filter-tab">奢侈品护理</div>
19</div>
20<div class="sort-bar"><span class="on">综合排序</span><span>销量优先</span><span>价格从低到高</span></div>
21<div class="section-title">全部洗护服务 <span>共 6 大类 36 项</span></div>
22<div id="svcList"></div>
23<div style="height:70px"></div>
24
25
26<nav class="tabbar"><a class="" href="index.html"><span class="icon">🏠</span>首页</a><a class=" active" href="category.html"><span class="icon">🧼</span>服务</a><a class="" href="vip.html"><span class="icon">💎</span>会员</a><a class="" href="track.html"><span class="icon">📦</span>进度</a><a class="" href="mine.html"><span class="icon">👤</span>我的</a></nav>
27<script src="data.js"></script>
28<script>
29 var fl = document.getElementById('svcList');
30 var h = '';
31 window.DATA.services.forEach(function (f) {
32 h += '<div class="svc-card"><div class="sc-img">' + f.img + '</div><div class="sc-body">'
33 + '<div class="sc-name">' + f.name + (f.hot ? ' <span class="badge badge-hot">热</span>' : '') + (f.new ? ' <span class="badge badge-new">新</span>' : '') + '</div>'
34 + '<div class="sc-desc">' + f.desc + '</div>'
35 + '<div class="sc-meta">' + f.tags.join(' · ') + ' · 年洗 ' + (f.sales/10000).toFixed(1) + ' 万双</div>'
36 + '<div class="sc-foot"><div class="sc-price">¥' + f.price + '<small> /原' + f.old + '</small></div>'
37 + '<div class="sc-btn">选服务</div></div></div></div>';
38 });
39 fl.innerHTML = h;
40</script>
41<script src="app.js"></script>
42</body>
43</html>