到不能跳级使用，因搜索引擎和屏幕阅读器依赖其严格逐级嵌套构建语义大纲；必须全页唯一代表核心主题，为直接子级，跳级（如后接）将导致无障碍访问失败与seo权重错配。
为什么 <h1></h1> 到 <h6></h6> 不能随便嵌套或跳级使用
搜索引擎和屏幕阅读器依赖标题层级理解页面结构。<h1></h1> 应该全页唯一，代表主主题；<h2></h2> 是它的直接子级，<h3></h3> 再往下——不是字号大小问题，而是语义嵌套关系。跳级（比如 <h2></h2> 后直接写 <h4></h4>）会破坏大纲，导致无障碍访问失败，也影响 SEO。
- 常见错误：
<h1>首页</h1> <h3>关于我们</h3>（缺<h2></h2>层） - 正确做法：用
<section></section>或<article></article>隔离不同语义区块，各自从<h2></h2>开始 -
<h1></h1>在整页中只出现一次，别为了“看起来大”重复用
<p></p> 和 <br> 的本质区别在哪
<p></p> 是语义化段落容器，自带上下外边距、可继承样式、支持嵌套内联元素；<br> 是纯换行指令，无语义、无盒模型、不能设置 margin/padding。混用会导致样式失控和响应式错乱。
- 误用场景：用多个
<br>模拟段落间距 → 改用<p></p>+ CSSmargin - 唯一合理用法：
<br>只用于诗歌、地址、歌词等需要精确换行的文本内部 - 注意：
<br>是自闭合标签，写成<br>或<br>都可以，但不要写<br>
<strong></strong> 和 <b></b>、<em></em> 和 <i></i> 怎么选
语义优先：<strong></strong> 表示内容重要性提升（如警告、关键结论），屏幕阅读器会加重语气；<b></b> 仅表示视觉加粗，无语义权重。<em></em> 是强调，有语音语调变化；<i></i> 是特殊状态，比如外语词、术语、船名、思想实验名称。
- 写“密码必须包含至少8位” → 用
<strong></strong> - 写“《百年孤独》是魔幻现实主义代表作” → 书名用
<i></i> - 避免用
<b></b>或<i></i>替代 CSS 的font-weight/font-style
alt 属性为什么必须写，哪怕只是空字符串
<img> 标签的 alt 不是“可选提示”，而是可访问性的强制要求。它在图片加载失败、禁用图片时显示，更是屏幕阅读器唯一能读出的图像描述。空 alt="" 表示“该图无文字信息”，比不写更安全。
- 装饰性图片（如分隔线、背景花纹）→
alt="" - 功能性图片（如按钮图标）→
alt="搜索"，不能写“放大镜图标” - 信息图/图表 →
alt要概括核心数据，或配合<figure><figcaption></figcaption></figure>补充 - 不写
alt会被 Lighthouse 等工具标为严重可访问性问题
<h2></h2> 当作“比 <p></p> 大一号的字”来用，后续维护、SEO、无障碍都会陆续出问题。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
