import{_ as p,c as g,b as i,e as t,a as d,d as s,w as k,r,o as y}from"./app-FFcgQi-5.js";const D={},A={class:"code-block-title","data-title":"index.html"},c={class:"code-block-title-bar"},B={class:"title"},u={class:"code-block-title","data-title":"index.html"},m={class:"code-block-title-bar"},v={class:"title"},o={class:"code-block-title","data-title":"index.html"},E={class:"code-block-title-bar"},b={class:"title"},C={class:"code-block-title","data-title":"index.html"},F={class:"code-block-title-bar"},f={class:"title"},x={class:"code-block-title","data-title":"index.html"},j={class:"code-block-title-bar"},S={class:"title"};function q(T,h){const e=r("VPIcon"),n=r("CodeTabs");return y(),g("div",null,[h[60]||(h[60]=i("h2",{id:"四、列表-ul-ol-li",tabindex:"-1"},[i("a",{class:"header-anchor",href:"#四、列表-ul-ol-li"},[i("span",null,"四、列表（UL/OL/LI）")])],-1)),h[61]||(h[61]=i("p",null,"无序列表（圆点）：",-1)),i("div",A,[i("div",c,[i("span",B,[t(e,{provider:"iconify",name:"vscode-icons:file-type-html"}),h[0]||(h[0]=s("index.html",-1))])]),h[1]||(h[1]=d(`<ul>
<li>学习笔记</li>
<li>工具推荐</li>
<li>友情链接</li>
</ul>
<ol>
<li>需求与原型</li>
<li>API 设计</li>
<li>联调与验收</li>
</ol>
<header>
<h1>我的网站</h1>
<nav>
<a href="/blog/">博客</a>
<a href="/notes/">笔记</a>
</nav>
<!-- 注意：更复杂的导航通常配合 CSS/JS 做响应式菜单 -->
<!-- 小提示：块级容器的外层仍可使用 <div> 来做网格或栅格布局 -->
<!-- 例如 <div class="container"> 包裹全站 -->
<!-- 只是这些语义标签会让搜索引擎更理解结构 -->
<!-- 语义标签与 <div> 并不冲突，可以配合使用 -->
<!-- 选择语义标签能让你的 HTML 更“有含义”而非只是分区 -->
<!-- 如果仅用于布局、无明确语义，用 <div> 即可 -->
<!-- 这段说明旨在帮助你建立语义化与布局之间的直觉 -->
<!-- 逐步养成好的结构化写法 -->
<!-- 让内容更可维护，更易被机器理解 -->
<!-- （继续往下看，还会介绍 Article/Section 等） -->
<table>
<thead>
<tr>
<th>姓名</th>
<th>职业</th>
</tr>
</thead>
<tbody>
<tr>
<td>祀梦</td>
<td>开发者</td>
</tr>
</tbody>
</table>
<audio src="bgm.mp3" controls loop></audio>
<video src="intro.mp4" controls width="480" poster="cover.jpg" muted></video>
<!-- 常用属性：controls / autoplay / loop / muted / poster（封面） -->
补充说明：
controls 提供播放控制；一般不建议隐藏，保证可用性。autoplay 可能被浏览器限制；若需自动播放，通常需同时设置 muted。preload 控制预加载策略（none/metadata/auto），根据页面性能需求选择。poster 为视频未播放时的封面图；音频没有封面属性。- 使用
<source> 指定多种格式与 MIME 类型，提升兼容性：<source src="xxx.mp4" type="video/mp4">。
小案例：嵌入音视频
",3)),t(n,{id:"142",data:[{id:"index.html"},{id:"style.css"}]},{title0:k(({value:l,isActive:a})=>[t(e,{provider:"iconify",name:"vscode-icons:file-type-html"}),h[40]||(h[40]=i("span",null,"index.html",-1))]),title1:k(({value:l,isActive:a})=>[t(e,{provider:"iconify",name:"vscode-icons:file-type-css"}),h[41]||(h[41]=i("span",null,"style.css",-1))]),tab0:k(({value:l,isActive:a})=>[...h[42]||(h[42]=[i("div",{class:"language-html line-numbers-mode","data-highlighter":"shiki","data-ext":"html",style:{"--shiki-light":"#393a34","--shiki-dark":"#dbd7caee","--shiki-light-bg":"#ffffff","--shiki-dark-bg":"#121212"}},[i("pre",{class:"shiki shiki-themes vitesse-light vitesse-dark vp-code"},[i("code",{class:"language-html"},[i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"<"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"html"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," lang"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"zh-CN"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"head"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"meta"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," charset"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"utf-8"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"title"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">"),i("span",{style:{"--shiki-light":"#393A34","--shiki-dark":"#DBD7CAEE"}},"媒体案例"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"link"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," rel"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"stylesheet"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," href"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"style.css"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"body"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"h2"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">"),i("span",{style:{"--shiki-light":"#393A34","--shiki-dark":"#DBD7CAEE"}},"背景音乐"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"audio"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," src"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"bgm.mp3"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," controls"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," loop"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"h2"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">"),i("span",{style:{"--shiki-light":"#393A34","--shiki-dark":"#DBD7CAEE"}},"介绍视频"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"video"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," src"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"intro.mp4"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," controls"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," width"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"480"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," poster"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"cover.jpg"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," muted"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"")])])]),i("div",{class:"line-numbers","aria-hidden":"true",style:{"counter-reset":"line-number 0"}},[i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"})])],-1)])]),tab1:k(({value:l,isActive:a})=>[...h[43]||(h[43]=[i("div",{class:"language-css line-numbers-mode","data-highlighter":"shiki","data-ext":"css",style:{"--shiki-light":"#393a34","--shiki-dark":"#dbd7caee","--shiki-light-bg":"#ffffff","--shiki-dark-bg":"#121212"}},[i("pre",{class:"shiki shiki-themes vitesse-light vitesse-dark vp-code"},[i("code",{class:"language-css"},[i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"video"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," {"),i("span",{style:{"--shiki-light":"#998418","--shiki-dark":"#B8A965"}}," display"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},":"),i("span",{style:{"--shiki-light":"#A65E2B","--shiki-dark":"#C99076"}}," block"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},";"),i("span",{style:{"--shiki-light":"#998418","--shiki-dark":"#B8A965"}}," margin-top"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},":"),i("span",{style:{"--shiki-light":"#2F798A","--shiki-dark":"#4C9A91"}}," .5"),i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}},"rem"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},";"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," }")])])]),i("div",{class:"line-numbers","aria-hidden":"true",style:{"counter-reset":"line-number 0"}},[i("div",{class:"line-number"})])],-1)])]),_:1}),h[76]||(h[76]=i("p",null,[i("strong",null,"小作业：添加一段你喜欢的音乐与视频")],-1)),t(n,{id:"153",data:[{id:"index.html"},{id:"style.css"}]},{title0:k(({value:l,isActive:a})=>[t(e,{provider:"iconify",name:"vscode-icons:file-type-html"}),h[44]||(h[44]=i("span",null,"index.html",-1))]),title1:k(({value:l,isActive:a})=>[t(e,{provider:"iconify",name:"vscode-icons:file-type-css"}),h[45]||(h[45]=i("span",null,"style.css",-1))]),tab0:k(({value:l,isActive:a})=>[...h[46]||(h[46]=[i("div",{class:"language-html line-numbers-mode","data-highlighter":"shiki","data-ext":"html",style:{"--shiki-light":"#393a34","--shiki-dark":"#dbd7caee","--shiki-light-bg":"#ffffff","--shiki-dark-bg":"#121212"}},[i("pre",{class:"shiki shiki-themes vitesse-light vitesse-dark vp-code"},[i("code",{class:"language-html"},[i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"<"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"html"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," lang"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"zh-CN"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"head"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"meta"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," charset"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"utf-8"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"title"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">"),i("span",{style:{"--shiki-light":"#393A34","--shiki-dark":"#DBD7CAEE"}},"我的媒体"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"link"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," rel"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"stylesheet"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," href"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"style.css"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"body"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"audio"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," src"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"music.mp3"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," controls"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"video"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," src"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"movie.mp4"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," controls"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," width"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"480"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," poster"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"cover.jpg"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"")])])]),i("div",{class:"line-numbers","aria-hidden":"true",style:{"counter-reset":"line-number 0"}},[i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"})])],-1)])]),tab1:k(({value:l,isActive:a})=>[...h[47]||(h[47]=[i("div",{class:"language-css line-numbers-mode","data-highlighter":"shiki","data-ext":"css",style:{"--shiki-light":"#393a34","--shiki-dark":"#dbd7caee","--shiki-light-bg":"#ffffff","--shiki-dark-bg":"#121212"}},[i("pre",{class:"shiki shiki-themes vitesse-light vitesse-dark vp-code"},[i("code",{class:"language-css"},[i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"audio"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},","),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}}," video"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," {"),i("span",{style:{"--shiki-light":"#998418","--shiki-dark":"#B8A965"}}," display"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},":"),i("span",{style:{"--shiki-light":"#A65E2B","--shiki-dark":"#C99076"}}," block"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},";"),i("span",{style:{"--shiki-light":"#998418","--shiki-dark":"#B8A965"}}," margin"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},":"),i("span",{style:{"--shiki-light":"#2F798A","--shiki-dark":"#4C9A91"}}," .5"),i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}},"rem"),i("span",{style:{"--shiki-light":"#2F798A","--shiki-dark":"#4C9A91"}}," 0"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},";"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," }")])])]),i("div",{class:"line-numbers","aria-hidden":"true",style:{"counter-reset":"line-number 0"}},[i("div",{class:"line-number"})])],-1)])]),_:1}),h[77]||(h[77]=d('id：唯一标识，用于 JS/CSS 精确选择。class：分组与样式选择（上一课已讲）。style：内联样式（不推荐大量使用，建议写到 CSS 文件）。title：悬停提示文字。data-*：自定义数据属性（如 data-user-id="42"）。aria-*：无障碍相关属性，帮助读屏工具理解（如 aria-label）。
小案例：使用 id/class/data/title/aria
',3)),t(n,{id:"199",data:[{id:"index.html"},{id:"style.css"},{id:"app.js"}]},{title0:k(({value:l,isActive:a})=>[t(e,{provider:"iconify",name:"vscode-icons:file-type-html"}),h[48]||(h[48]=i("span",null,"index.html",-1))]),title1:k(({value:l,isActive:a})=>[t(e,{provider:"iconify",name:"vscode-icons:file-type-css"}),h[49]||(h[49]=i("span",null,"style.css",-1))]),title2:k(({value:l,isActive:a})=>[t(e,{provider:"iconify",name:"vscode-icons:file-type-js"}),h[50]||(h[50]=i("span",null,"app.js",-1))]),tab0:k(({value:l,isActive:a})=>[...h[51]||(h[51]=[i("div",{class:"language-html line-numbers-mode","data-highlighter":"shiki","data-ext":"html",style:{"--shiki-light":"#393a34","--shiki-dark":"#dbd7caee","--shiki-light-bg":"#ffffff","--shiki-dark-bg":"#121212"}},[i("pre",{class:"shiki shiki-themes vitesse-light vitesse-dark vp-code"},[i("code",{class:"language-html"},[i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"<"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"html"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," lang"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"zh-CN"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"head"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"meta"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," charset"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"utf-8"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"title"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">"),i("span",{style:{"--shiki-light":"#393A34","--shiki-dark":"#DBD7CAEE"}},"全局属性案例"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"link"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," rel"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"stylesheet"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," href"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"style.css"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"script"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," defer"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," src"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"app.js"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"body"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"button"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," id"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"likeBtn"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," class"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"btn"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," title"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"点赞一下"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," data-count"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"0"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," aria-label"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"点赞"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">"),i("span",{style:{"--shiki-light":"#393A34","--shiki-dark":"#DBD7CAEE"}},"👍 喜欢"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"p"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," id"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"msg"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," class"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"note"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," aria-live"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"polite"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">"),i("span",{style:{"--shiki-light":"#393A34","--shiki-dark":"#DBD7CAEE"}},"点击按钮试试。"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"")])])]),i("div",{class:"line-numbers","aria-hidden":"true",style:{"counter-reset":"line-number 0"}},[i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"})])],-1)])]),tab1:k(({value:l,isActive:a})=>[...h[52]||(h[52]=[i("div",{class:"language-css line-numbers-mode","data-highlighter":"shiki","data-ext":"css",style:{"--shiki-light":"#393a34","--shiki-dark":"#dbd7caee","--shiki-light-bg":"#ffffff","--shiki-dark-bg":"#121212"}},[i("pre",{class:"shiki shiki-themes vitesse-light vitesse-dark vp-code"},[i("code",{class:"language-css"},[i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"btn"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," {"),i("span",{style:{"--shiki-light":"#998418","--shiki-dark":"#B8A965"}}," padding"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},":"),i("span",{style:{"--shiki-light":"#2F798A","--shiki-dark":"#4C9A91"}}," .5"),i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}},"rem"),i("span",{style:{"--shiki-light":"#2F798A","--shiki-dark":"#4C9A91"}}," .75"),i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}},"rem"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},";"),i("span",{style:{"--shiki-light":"#998418","--shiki-dark":"#B8A965"}}," border"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},":"),i("span",{style:{"--shiki-light":"#2F798A","--shiki-dark":"#4C9A91"}}," 1"),i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}},"px"),i("span",{style:{"--shiki-light":"#A65E2B","--shiki-dark":"#C99076"}}," solid"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," #"),i("span",{style:{"--shiki-light":"#A65E2B","--shiki-dark":"#C99076"}},"ccc"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},";"),i("span",{style:{"--shiki-light":"#998418","--shiki-dark":"#B8A965"}}," border-radius"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},":"),i("span",{style:{"--shiki-light":"#2F798A","--shiki-dark":"#4C9A91"}}," 6"),i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}},"px"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},";"),i("span",{style:{"--shiki-light":"#998418","--shiki-dark":"#B8A965"}}," background"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},":"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," #"),i("span",{style:{"--shiki-light":"#A65E2B","--shiki-dark":"#C99076"}},"fff"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},";"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," }")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"note"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," {"),i("span",{style:{"--shiki-light":"#998418","--shiki-dark":"#B8A965"}}," color"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},":"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," #"),i("span",{style:{"--shiki-light":"#A65E2B","--shiki-dark":"#C99076"}},"555"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},";"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," }")])])]),i("div",{class:"line-numbers","aria-hidden":"true",style:{"counter-reset":"line-number 0"}},[i("div",{class:"line-number"}),i("div",{class:"line-number"})])],-1)])]),tab2:k(({value:l,isActive:a})=>[...h[53]||(h[53]=[i("div",{class:"language-js line-numbers-mode","data-highlighter":"shiki","data-ext":"js",style:{"--shiki-light":"#393a34","--shiki-dark":"#dbd7caee","--shiki-light-bg":"#ffffff","--shiki-dark-bg":"#121212"}},[i("pre",{class:"shiki shiki-themes vitesse-light vitesse-dark vp-code"},[i("code",{class:"language-js"},[i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}},"const"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," btn"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ="),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," document"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#59873A","--shiki-dark":"#80A665"}},"getElementById"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"("),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},"'"),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"likeBtn"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},"'"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},");")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}},"const"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," msg"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ="),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," document"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#59873A","--shiki-dark":"#80A665"}},"getElementById"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"("),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},"'"),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"msg"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},"'"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},");")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"btn"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#59873A","--shiki-dark":"#80A665"}},"addEventListener"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"("),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},"'"),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"click"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},"'"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},","),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ()"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," =>"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," {")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}}," const"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," count"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ="),i("span",{style:{"--shiki-light":"#59873A","--shiki-dark":"#80A665"}}," Number"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"("),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"btn"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"dataset"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"count"),i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}}," ||"),i("span",{style:{"--shiki-light":"#2F798A","--shiki-dark":"#4C9A91"}}," 0"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},")"),i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}}," +"),i("span",{style:{"--shiki-light":"#2F798A","--shiki-dark":"#4C9A91"}}," 1"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},";")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," btn"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"dataset"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"count"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ="),i("span",{style:{"--shiki-light":"#59873A","--shiki-dark":"#80A665"}}," String"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"("),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"count"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},");")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," msg"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"textContent"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}}," `"),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"已点赞 "),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"${"),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"count"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"}"),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}}," 次"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},"`"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},";")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"});")])])]),i("div",{class:"line-numbers","aria-hidden":"true",style:{"counter-reset":"line-number 0"}},[i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"})])],-1)])]),_:1}),h[78]||(h[78]=i("p",null,[i("strong",null,"小作业：做一个带计数的按钮")],-1)),t(n,{id:"213",data:[{id:"index.html"},{id:"style.css"},{id:"app.js"}]},{title0:k(({value:l,isActive:a})=>[t(e,{provider:"iconify",name:"vscode-icons:file-type-html"}),h[54]||(h[54]=i("span",null,"index.html",-1))]),title1:k(({value:l,isActive:a})=>[t(e,{provider:"iconify",name:"vscode-icons:file-type-css"}),h[55]||(h[55]=i("span",null,"style.css",-1))]),title2:k(({value:l,isActive:a})=>[t(e,{provider:"iconify",name:"vscode-icons:file-type-js"}),h[56]||(h[56]=i("span",null,"app.js",-1))]),tab0:k(({value:l,isActive:a})=>[...h[57]||(h[57]=[i("div",{class:"language-html line-numbers-mode","data-highlighter":"shiki","data-ext":"html",style:{"--shiki-light":"#393a34","--shiki-dark":"#dbd7caee","--shiki-light-bg":"#ffffff","--shiki-dark-bg":"#121212"}},[i("pre",{class:"shiki shiki-themes vitesse-light vitesse-dark vp-code"},[i("code",{class:"language-html"},[i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"<"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"html"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," lang"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"zh-CN"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"head"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"meta"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," charset"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"utf-8"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"title"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">"),i("span",{style:{"--shiki-light":"#393A34","--shiki-dark":"#DBD7CAEE"}},"计数按钮"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"link"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," rel"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"stylesheet"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," href"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"style.css"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"script"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," defer"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," src"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"app.js"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"body"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"button"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," id"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"counter"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," class"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"btn"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," title"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"点击增加"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," data-count"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"0"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">"),i("span",{style:{"--shiki-light":"#393A34","--shiki-dark":"#DBD7CAEE"}},"点击我"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," <"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"p"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," id"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"status"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," class"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"note"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},'"'),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},">"),i("span",{style:{"--shiki-light":"#393A34","--shiki-dark":"#DBD7CAEE"}},"当前计数：0"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"")])])]),i("div",{class:"line-numbers","aria-hidden":"true",style:{"counter-reset":"line-number 0"}},[i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"})])],-1)])]),tab1:k(({value:l,isActive:a})=>[...h[58]||(h[58]=[i("div",{class:"language-css line-numbers-mode","data-highlighter":"shiki","data-ext":"css",style:{"--shiki-light":"#393a34","--shiki-dark":"#dbd7caee","--shiki-light-bg":"#ffffff","--shiki-dark-bg":"#121212"}},[i("pre",{class:"shiki shiki-themes vitesse-light vitesse-dark vp-code"},[i("code",{class:"language-css"},[i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"btn"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," {"),i("span",{style:{"--shiki-light":"#998418","--shiki-dark":"#B8A965"}}," padding"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},":"),i("span",{style:{"--shiki-light":"#2F798A","--shiki-dark":"#4C9A91"}}," .5"),i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}},"rem"),i("span",{style:{"--shiki-light":"#2F798A","--shiki-dark":"#4C9A91"}}," .75"),i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}},"rem"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},";"),i("span",{style:{"--shiki-light":"#998418","--shiki-dark":"#B8A965"}}," border"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},":"),i("span",{style:{"--shiki-light":"#2F798A","--shiki-dark":"#4C9A91"}}," 1"),i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}},"px"),i("span",{style:{"--shiki-light":"#A65E2B","--shiki-dark":"#C99076"}}," solid"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," #"),i("span",{style:{"--shiki-light":"#A65E2B","--shiki-dark":"#C99076"}},"ccc"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},";"),i("span",{style:{"--shiki-light":"#998418","--shiki-dark":"#B8A965"}}," border-radius"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},":"),i("span",{style:{"--shiki-light":"#2F798A","--shiki-dark":"#4C9A91"}}," 6"),i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}},"px"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},";"),i("span",{style:{"--shiki-light":"#998418","--shiki-dark":"#B8A965"}}," background"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},":"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," #"),i("span",{style:{"--shiki-light":"#A65E2B","--shiki-dark":"#C99076"}},"fff"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},";"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," }")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"note"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," {"),i("span",{style:{"--shiki-light":"#998418","--shiki-dark":"#B8A965"}}," margin-top"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},":"),i("span",{style:{"--shiki-light":"#2F798A","--shiki-dark":"#4C9A91"}}," .5"),i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}},"rem"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},";"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," }")])])]),i("div",{class:"line-numbers","aria-hidden":"true",style:{"counter-reset":"line-number 0"}},[i("div",{class:"line-number"}),i("div",{class:"line-number"})])],-1)])]),tab2:k(({value:l,isActive:a})=>[...h[59]||(h[59]=[i("div",{class:"language-js line-numbers-mode","data-highlighter":"shiki","data-ext":"js",style:{"--shiki-light":"#393a34","--shiki-dark":"#dbd7caee","--shiki-light-bg":"#ffffff","--shiki-dark-bg":"#121212"}},[i("pre",{class:"shiki shiki-themes vitesse-light vitesse-dark vp-code"},[i("code",{class:"language-js"},[i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}},"const"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," counter"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ="),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," document"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#59873A","--shiki-dark":"#80A665"}},"getElementById"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"("),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},"'"),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"counter"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},"'"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},");")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}},"const"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," statusEl"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ="),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," document"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#59873A","--shiki-dark":"#80A665"}},"getElementById"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"("),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},"'"),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"status"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},"'"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},");")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"counter"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#59873A","--shiki-dark":"#80A665"}},"addEventListener"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"("),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},"'"),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"click"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},"'"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},","),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ()"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," =>"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," {")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}}," const"),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," count"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ="),i("span",{style:{"--shiki-light":"#59873A","--shiki-dark":"#80A665"}}," Number"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"("),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"counter"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"dataset"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"count"),i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}}," ||"),i("span",{style:{"--shiki-light":"#2F798A","--shiki-dark":"#4C9A91"}}," 0"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},")"),i("span",{style:{"--shiki-light":"#AB5959","--shiki-dark":"#CB7676"}}," +"),i("span",{style:{"--shiki-light":"#2F798A","--shiki-dark":"#4C9A91"}}," 1"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},";")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," counter"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"dataset"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"count"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ="),i("span",{style:{"--shiki-light":"#59873A","--shiki-dark":"#80A665"}}," String"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"("),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"count"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},");")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}}," statusEl"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"."),i("span",{style:{"--shiki-light":"#B07D48","--shiki-dark":"#BD976A"}},"textContent"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}}," ="),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}}," `"),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"当前计数："),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"${"),i("span",{style:{"--shiki-light":"#B56959","--shiki-dark":"#C98A7D"}},"count"),i("span",{style:{"--shiki-light":"#1E754F","--shiki-dark":"#4D9375"}},"}"),i("span",{style:{"--shiki-light":"#B5695977","--shiki-dark":"#C98A7D77"}},"`"),i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},";")]),s(`
`),i("span",{class:"line"},[i("span",{style:{"--shiki-light":"#999999","--shiki-dark":"#666666"}},"});")])])]),i("div",{class:"line-numbers","aria-hidden":"true",style:{"counter-reset":"line-number 0"}},[i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"}),i("div",{class:"line-number"})])],-1)])]),_:1}),h[79]||(h[79]=i("h2",{id:"结尾-先结构清晰-再上样式与交互",tabindex:"-1"},[i("a",{class:"header-anchor",href:"#结尾-先结构清晰-再上样式与交互"},[i("span",null,"结尾：先结构清晰，再上样式与交互")])],-1)),h[80]||(h[80]=i("p",null,"写网页像搭房子：先把房间（结构标签）安排好，再选家具颜色（CSS），最后加智能设备（JS）。",-1)),h[81]||(h[81]=i("p",null,"建议你先用这些常用标签做一个“个人名片页”，含标题、段落、头像图片、导航链接和一个简单表单。练熟后再加样式与交互。",-1)),h[82]||(h[82]=i("p",null,[i("strong",null,"延伸阅读"),s("：")],-1)),h[83]||(h[83]=i("ul",null,[i("li",null,"HTML 规范与参考（MDN）：https://developer.mozilla.org/en-US/docs/Web/HTML"),i("li",null,"无障碍与语义化：https://developer.mozilla.org/en-US/docs/Glossary/Semantics")],-1))])}const L=p(D,[["render",q]]),P=JSON.parse('{"path":"/programming/web/basic-syntax/html-lists-and-semantic-layout/","title":"test","lang":"zh-CN","frontmatter":{"title":"test","createTime":"2025/11/02 20:47:50","permalink":"/programming/web/basic-syntax/html-lists-and-semantic-layout/"},"readingTime":{"minutes":6.92,"words":2076},"git":{"createdTime":1762087833000,"updatedTime":1762087833000,"contributors":[{"name":"Kawaxxxsaki","username":"","email":"1111@123.com","commits":1,"avatar":"https://gravatar.com/avatar/b3cd57e776cc1b92ffa9800b35152c0ce7692893d12a14450061083fcacd34ce?d=retro"}]},"filePathRelative":"notes/programming/web/basic-syntax/html-lists-and-semantic-layout.md","headers":[]}');export{L as comp,P as data};