有序列表中直接使用<p>会破坏语义结构，因<ol>合法子元素仅限<li>；浏览器自动修复会导致序号错位、样式脱钩及屏幕阅读器异常；正确做法是在<li>内嵌套<p>或多段内容，确保语义合规与可访问性。
有序列表里直接写 <p> 会破坏语义结构
浏览器虽然能渲染，但 <ol> 的合法子元素只有 <li>，其他标签如 <p>、<div> 都属于无效嵌套。HTML 解析器会自动“修复”——比如把 <p> 挤到 <li> 外面，导致序号错位、样式脱钩、屏幕阅读器读取异常。
<li> 内部可以自由使用段落级内容
真正需要的不是“在列表里插段落”，而是让每个列表项支持多段文字、换行或内联样式。这完全合法，也符合语义：
<ol>
<li>
<p>这是第一段说明文字。</p>
<p>这是第二段，包含更多细节。</p>
</li>
<li>单行内容也可以混用，比如这行没包 <code><p></code>，但下一行有：<br><p>另起一段更清晰。</p></li>
</ol>
-
<p>必须完整闭合，不能只写<p>就结束 - 多个
<p>并列在同一个<li>内是标准做法，CSS 可统一控制间距 - 如果只是想换行不需新段落，用
<br>更轻量，但语义弱于<p>
用 CSS 控制 <li> 内部段落的缩进与间距
默认情况下，<p> 在 <li> 里会有上下外边距，可能让列表项显得松散。常见调整方式：
- 重置
<li> > p的margin，再用padding统一控制内部留白 - 避免对
<ol>或<li>设置line-height过大，否则多段<p>会叠高 - 若需首行缩进，直接给
<li> > p加text-indent，别碰<li>自身的padding-left（会干扰序号对齐）
替代方案：当内容复杂到超出列表语义时，就该换结构
如果每个“列表项”实际包含标题、多段描述、代码块甚至子列表，<ol> 就不是最佳选择。这时候应考虑：
立即学习“前端免费学习笔记（深入）”；
- 用
<section>+<h2>等语义标题组织内容，序号改用 CSS 的counter-increment实现 - 保留
<ol>仅用于真正有顺序依赖的操作步骤（如安装流程），其余用定义列表<dl>或普通区块 - 服务端或 Markdown 渲染时，注意转换逻辑是否把空行误判为新
<li>—— 这类问题常被当成 HTML 问题，实则是解析层失控
最易被忽略的是：序号本身不是内容，而是对内容顺序关系的提示。一旦你开始往 <li> 里塞表格、<pre>、表单，就得问一句——它还是个“列表项”吗？
