内不能嵌套块级元素（如、～、等），因html规范限定其仅允许phrasing content（内联内容）；浏览器会静默修正为xxx，导致dom异常、样式失效、js选中失败及可访问性问题。
为什么
里不能放
是流式内容元素，语义上只允许包含**内联内容**（如<span></span>、@#@#@#@#@#@#@#@#@#@0虽不报错，但<div>会破坏<code><p></p><div class="aritcle_card flexRow artxards">
<div class="artcardd flexRow">
<a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill7761" title="Article To Html"><img
src="https://img.php.cn/upload/skill/000/000/081/179168408018805.jpg" alt="Article To Html" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a rel="nofollow" href="/xiazai/skill7761" title="Article To Html" class="overflowclass">Article To Html</a>
<p class="overflowclass">文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。</p>
</div>
<a rel="nofollow" href="/xiazai/skill7761" title="Article To Html" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span>
</a>
</div>
</div>的内联上下文，导致默认垂直居中失效；
<p><span>A</span>\n<span>B</span></p>，换行符会被当成文本节点，影响行内布局间距。真正难的不是记住规则，而是习惯在写标签前先问一句：这个内容，在自然阅读中是不是一个独立段落？如果不是，就别碰<p></p>。
