标题必须按层级使用且不跳级，禁止嵌套块级元素，须为自闭合单标签；语义错误会导致渲染异常、读屏失效及seo下降。
<h1></h1> 到 <h6></h6> 必须按层级使用，<p></p> 不能嵌套块级标签，<br> 是单标签、不能写成 <br> —— 这些不是细节，是页面渲染出错或语义失效的直接原因。
标题标签 <h1></h1>～<h6></h6> 怎么用才不翻车
浏览器和屏幕阅读器靠标题层级理解内容结构，SEO 也强依赖这个顺序。跳级（比如 <h1></h1> 后直接写 <h3></h3>）会让语义断裂，部分辅助工具会跳过中间层级。
- 一个页面只用一次
<h1></h1>，通常是主标题或 Logo 文字 -
<h2></h2>对应章节，<h3></h3>是子模块，逐级向下，不跳不回 - 别为了“看起来大”滥用
<h1></h1>；样式调整交给 CSS，标题标签只管语义 -
<h1></h1>默认加粗+换行+较大字号，但这些是浏览器默认样式，可被 CSS 覆盖
<p></p> 段落标签的隐藏规则
<p></p> 不是“换两行就写一个”的自由容器。它是语义化段落，自带上下外边距（margin），且严格禁止在内部嵌套 <div>、<code><h2></h2> 等块级元素。
- 连续多段文字，每段都用独立的
<p></p>包裹，不要用多个<br>模拟段落 - 想让段落不换行？改 CSS 的
display或margin，别删<p></p>标签 - 段落里可以放心放
<strong></strong>、<em></em>、<a></a>这类行内元素 - 空段落
<p></p>会被渲染为一行空白，但语义上无意义，尽量避免
<br> 和 <hr> 别混用
<br> 是强制换行，<hr> 是语义化的“主题分隔”，两者用途完全不重叠。用错会导致可访问性下降和样式失控。
-
<br>是自闭合单标签，必须写成<br>或<br>，不能加结束标签 -
<hr>表示内容逻辑上的中断（比如话题切换），不是视觉装饰；它默认是一条浅灰横线，可用 CSS 替换 - 地址、诗歌、歌词等需要保留原始换行的场景，才用
<br>；普通文案分段请用<p></p> - 用
<hr>做分割线时，别再套<div> 或加多余 class——它本身就有语义 <p>真正容易被忽略的是：所有这些标签的语义价值，在静态页面里看不出来，但一旦接入读屏软件、搜索引擎抓取、或后续用 JavaScript 动态操作 DOM，错误的嵌套或越级标题就会立刻暴露——不是报错，而是“看不见”或“读错”。</p> </div>
