`等块级元素——否则浏览器会自动纠错、破坏预期结构；掌握这些规则不仅能避免渲染异常，更是践行HTML语义化、提升可访问性与代码健壮性的关键基础。
p 标签内不能嵌套块级元素
浏览器会自动修正错误嵌套，把本该在 p 里的块级标签“踢出来”，导致 DOM 结构和预期不一致。比如写成 hello
，实际解析后变成 hello
p 被拆成两个空段落，div 被挤到外面。
这是 HTML 规范强制要求的：p 只能包含 文本节点 和 行内元素（inline-level elements），不能直接包裹任何块级元素（block-level elements）。
div、ul、ol、dl、h1–h6、table、form、blockquote 等都禁止出现在 p 内部br、span、a、strong、em、img、input、label 这类行内元素是允许的- 即使某个元素视觉上“看起来很小”（比如一个空
div 或 span 里塞了 display: block），只要它语义或默认是块级，就不能放进去
p 和 h1–h6 的嵌套限制是一样的
很多人只记得 p 不能包块级，却忽略 h1–h6 同样严格：它们也只接受行内内容。写 标题内容
div 会被移出，h2 变成空标签。
这种限制不是浏览器“脾气大”，而是语义决定的——标题和段落都是内容层级的原子单位，本身不承载容器逻辑。想包裹结构，得用 div、section 或 article 这类真正的容器元素。
dt 元素也遵循同样规则，只能含行内内容dd 相对宽松，可以包含块级元素（比如 div、p、ul）- 别依赖 CSS 的
display: inline 来“骗过”解析器——HTML 解析发生在样式计算之前
常见误用场景与替代方案
开发中容易踩坑的地方，往往不是故意乱写，而是没意识到某些标签本质是块级。比如：
- 用
svg 默认是行内，但若设了 display: block 或带宽高，就可能触发重排；稳妥做法是外层用 div 包裹再配 text-align 居中
- 试图在
p 里放 <select>：它们虽常被当“小控件”，但规范中属于“可替换行内元素”，部分浏览器允许，但不可靠；应改用 span + JS 模拟，或换容器
- 表单提示文字写成
<input type="text">
form 子元素规则，也违反 p 嵌套规则；正确方式是 <input>
验证嵌套是否合法的最简方法
别靠肉眼或浏览器渲染效果判断——DOM 已被自动修复。打开浏览器开发者工具，切换到 Elements 面板，看原始 HTML 是否被重排。更可靠的是用 W3C Markup Validation Service 在线校验，或本地跑 html-validate 工具。
真正容易被忽略的一点是：p 标签的结束标签其实可以省略（HTML5 允许），但一旦你手动写了开始标签 ）时，浏览器会立即隐式闭合前面的
p —— 这个“自动闭合时机”比你想象中更早、更机械。
今天带大家了解了的相关知识，希望对你有所帮助；关于文章的技术知识我们会一点点深入介绍，欢迎大家关注golang学习网公众号，一起学习编程~
Go channel 缓冲区FIFO特性解析
