r94/sound.html · 约 3206 字符
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<div class="app">
11 <header class="top">
12 <div class="top-l">专注者 · 阿哲</div>
13 <div class="top-r">白噪音</div>
14 </header>
15 <main class="main">
16<div class="card"><div class="row"><div class="sec-title" style="margin:0">🎧 正在播放</div><span class="badge b-acc">🌧️ 雨声</span></div>
17 <div class="bar"><i style="width:45%"></i></div>
18 <div class="row" style="margin-top:8px"><span class="muted">02:15 / 05:00</span><button class="btn sm" onclick="alert('暂停/播放（演示）')">⏯ 暂停</button></div>
19</div>
20<div class="sec-title">🌈 选择背景音</div>
21<div class="mgrid">
22 <a class="tile t-blue" href="#" onclick="event.preventDefault();alert('切换为 雨声（演示）')" style="text-decoration:none;color:inherit"><span class="te">🌧️</span><div><div class="tn" style="font-size:16px">雨声</div><div class="tl">连续白噪</div></div></a><a class="tile t-cyan" href="#" onclick="event.preventDefault();alert('切换为 海浪（演示）')" style="text-decoration:none;color:inherit"><span class="te">🌊</span><div><div class="tn" style="font-size:16px">海浪</div><div class="tl">海边长休</div></div></a><a class="tile t-green" href="#" onclick="event.preventDefault();alert('切换为 森林（演示）')" style="text-decoration:none;color:inherit"><span class="te">🌲</span><div><div class="tn" style="font-size:16px">森林</div><div class="tl">清晨鸟鸣</div></div></a><a class="tile t-amber" href="#" onclick="event.preventDefault();alert('切换为 咖啡馆（演示）')" style="text-decoration:none;color:inherit"><span class="te">☕</span><div><div class="tn" style="font-size:16px">咖啡馆</div><div class="tl">沉浸工位</div></div></a><a class="tile t-ind" href="#" onclick="event.preventDefault();alert('切换为 白噪音（演示）')" style="text-decoration:none;color:inherit"><span class="te">🔊</span><div><div class="tn" style="font-size:16px">白噪音</div><div class="tl">屏蔽干扰</div></div></a><a class="tile t-pink" href="#" onclick="event.preventDefault();alert('切换为 钢琴（演示）')" style="text-decoration:none;color:inherit"><span class="te">🎹</span><div><div class="tn" style="font-size:16px">钢琴</div><div class="tl">轻音乐</div></div></a>
23</div>
24<div class="card" style="margin-top:13px"><div class="set-row"><div><div class="nm">🔉 音量</div><div class="sm">当前 60%</div></div><div class="bar" style="width:120px"><i style="width:60%"></i></div></div></div>
25</main>
26 <nav class="nav"><a class=" on" href="index.html"><span class="ic">🏠</span>今日</a><a class="" href="timer.html"><span class="ic">⏱️</span>计时</a><a class="" href="habits.html"><span class="ic">✅</span>习惯</a><a class="" href="stats.html"><span class="ic">📊</span>统计</a><a class="" href="settings.html"><span class="ic">⚙️</span>设置</a></nav>
27</div>
28<script></script>
29</body>
30</html>