本身不负责内容分组，仅定义有序序列；真正实现分组的是元素，嵌套的或在内构成逻辑分组结构。

直接说结论：<ol></ol> 本身不负责“内容分组”，它只定义一个有顺序的项目序列；真正做内容分组的是 <li>，而嵌套的 <ol></ol> 或 <ul></ul> 才构成逻辑分组结构。

为什么 <ol></ol> 不能当分组容器用

<ol></ol> 是流内容元素，不是分组容器（如 <div>、<code><section></section>），它的内容模型只允许 <li> 直接子元素。试图在 <ol></ol> 里放 <p></p>、<h3></h3> 或其他非 <li> 元素，浏览器会自动纠错（比如把 <p></p> 提到 <ol></ol> 外），导致 DOM 结构错乱、样式失效、可访问性下降。

• 错误写法：<ol> <p>第一步</p><div class="aritcle_card flexRow artxards"> <div class="artcardd flexRow"> <a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill5806" title="html-deploy"><img src="https://img.php.cn/upload/skill/000/000/081/179066538882434.jpg" alt="html-deploy" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a> <div class="aritcle_card_info flexColumn"> <a rel="nofollow" href="/xiazai/skill5806" title="html-deploy" class="overflowclass">html-deploy</a> <p class="overflowclass">使用 htmlcode.fun 将 HTML 内容或文件部署到网页，适用于用户要求“部署到网页”“托管此 HTML”“生成此前端...的实时链接”等场景。</p> </div> <a rel="nofollow" href="/xiazai/skill5806" title="html-deploy" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a> </div> </div> <li>第二步</li> </ol> → 浏览器实际解析为 <p>第一步</p> <ol><li>第二步</li></ol>
• 正确写法：所有内容必须包裹在 <li> 内，哪怕里面是段落、标题或嵌套列表
• 语义上，<ol></ol> 表达的是“这一串事项有明确先后”，不是“我把这几块内容打包在一起”

<li> 才是真正的分组单元

每个 <li> 可以包含任意流内容：文本、<p></p>、<div>、<code><ul></ul>、<ol></ol>、图片、表单控件等。这才是实现“内容分组”的实际位置。

• 常见场景：多步骤说明中，每步含标题 + 描述 + 子步骤 → 全部塞进一个 <li>
• 示例：<ol><li> <h3>准备材料</h3> <p>需要纸笔和网络连接</p> <ul> <li>A4纸</li> <li>铅笔</li> </ul> </li></ol>
• 注意：嵌套的 <ol></ol> 或 <ul></ul> 必须放在某个 <li> 内部，否则结构非法

start 和 type 属性影响分组逻辑吗

不影响。这两个属性只控制编号外观，不改变 DOM 结构或语义分组关系。

• start="3" 让第一个 <li> 显示为 “3.”，但仍是第一个列表项，不创建新分组
• type="A" 改变字母序号样式（A、B、C），对嵌套层级、可访问性树、屏幕阅读器播报顺序均无实质影响
• 真正影响分组逻辑的是嵌套深度：外层 <ol></ol> → <li> → 内层 <ol></ol> → <li>，形成两级有序结构

容易被忽略的兼容性与可访问性细节

现代浏览器对嵌套 <ol></ol> 支持良好，但某些旧版读屏软件（如 JAWS 2020 之前版本）可能无法正确播报嵌套编号，比如把 “2.1” 读成 “2 点 1” 而非 “第二部分第一小节”。

• 避免过度嵌套：超过三层 <ol></ol> 嵌套易导致理解困难，也增加辅助技术解析负担
• 不要依赖 <ol></ol> 实现布局分组：想分栏、分区域，请用 <section></section>、<article></article> 或 <div>，再把 <code><ol></ol> 放进去
• 如果某组内容本质无顺序（比如并列的 FAQ 条目），即使用了数字编号，也该用 <ul></ul> + CSS 自定义序号，而非硬套 <ol></ol>