不能嵌套，因为html规范禁止其内容模型包含块级元素（包括自身），浏览器会强制闭合首个，导致dom变为子段落，引发布局错乱、样式失效；正确做法是用或包裹多段内容，并通过css控制间距。
为什么 <p></p> 不能嵌套 <p></p>
浏览器会自动修正错误结构，遇到 <p></p> 里再写 <p></p>，它会把第一个 <p></p> 关闭掉，导致布局错乱、样式失效。这不是警告，是强制修复。
- 真实表现：写
<p></p> <p>子段落</p><div class="aritcle_card flexRow artxards"> <div class="artcardd flexRow"> <a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill6712" title="Wechat HTML Publisher"><img src="https://img.php.cn/upload/skill/000/000/081/179109368394970.jpg" alt="Wechat HTML Publisher" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a> <div class="aritcle_card_info flexColumn"> <a rel="nofollow" href="/xiazai/skill6712" title="Wechat HTML Publisher" class="overflowclass">Wechat HTML Publisher</a> <p class="overflowclass">直接上传HTML富文本到微信公众号草稿箱。支持完整的HTML格式,无需Markdown转换。</p> </div> <a rel="nofollow" href="/xiazai/skill6712" title="Wechat HTML Publisher" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a> </div> </div>，实际渲染等价于<p></p> <p>子段落</p> - 正确做法：用
<div> 或语义化标签（如 <code><section></section>）包裹多段内容 - 想控制段内间距？改用 CSS 的
margin或padding，别靠嵌套 - 适合用
<strong></strong>：价格、警告、操作按钮文字（如“立即支付”） - 适合用
<b></b>：关键词高亮、产品名（无强调意图时），比如新闻标题里的品牌名 - 搜索引擎和读屏工具会忽略
<b></b>的语义，滥用<strong></strong>反而稀释重点 - 错误用法：用一堆
<br>拼出段落间距——这会让结构松散、响应式失效、无法统一调整行距 - 正确思路：每段文字用一个
<p></p>；需要紧凑排版（如作者信息）可用<div> + <code>display: inline-block - 注意：
<br>后面不能加空格或换行符，否则可能多出空白字符 - 常见陷阱：为“看起来小一点”而用
<h6></h6>写副标题，其实应该用<h2></h2>+ CSS 控制字号 - SEO 影响：搜索引擎依赖标题层级判断内容主次，
<h1></h1>缺失或重复会降低页面相关性评分 - 检查方法：用浏览器开发者工具的“无障碍”面板查看标题树，是否连贯、无断裂
<strong></strong> 和 <b></b> 看起来一样，但用错会影响 SEO 和无障碍
两者都加粗，但语义完全不同：<strong></strong> 表示内容有强重要性，屏幕阅读器会加重语气；<b></b> 只是视觉加粗，无语义权重。
<br> 不是换行的万能解，多数时候该用 <p></p> 或 CSS
<br> 是单标签，只做纯视觉换行，不带任何语义。它在地址、诗、歌词这类需要严格保留换行位置的场景才合理。
<h1></h1> 到 <h6></h6> 不是字号调节器，层级错乱直接伤及可访问性
一个页面只能有一个 <h1></h1>（通常是主标题），后续必须按逻辑顺序使用 <h2></h2>→<h3></h3>→…。跳级（如 <h2></h2> 后接 <h4></h4>）会让屏幕阅读器用户迷失结构。
