ol标签不支持多级嵌套自动重置编号，需用start="1"显式重置；编号与文字错位时用list-style-position:inside对齐；带父级前缀（如1.1）需CSS counters实现，但影响无障碍和打印，优先保障语义正确性。
ol 标签本身不支持多级嵌套编号重置？用 start 手动调
HTML 原生 <ol></ol> 不会自动为嵌套列表重置计数，比如二级步骤不会从 1 开始——它默认继承上级的继续编号。想让子步骤独立编号，得显式加 start="1"。
常见错误是只写 <ol><li>...</li></ol> 就以为能自动分层编号，结果出现 “1.1 → 1.2 → 2.1” 这类错乱（实际是纯线性 1,2,3,4…）。
- 一级流程用
<ol></ol>，编号自然从 1 起 - 每个子步骤块单独套一层
<ol start="1"></ol>，别依赖嵌套自动重置 -
start是字符串属性，写start="1"没问题，但不要写成start={1}（JSX 里也得加引号）
怎么让 ol 的编号和内容对齐不换行？用 list-style-position: inside
默认 <ol></ol> 编号在左侧外边距，长文字容易顶到编号上，视觉错位。说明书最怕排版挤在一起看不清步骤。
直接加内联样式或 CSS 类：
立即学习“前端免费学习笔记（深入）”；
<ol style="list-style-position: inside;"> <li>打开设置 → 点击“高级选项”</li> <li>勾选“启用调试模式”，然后重启应用</li> </ol>
-
inside让编号嵌入文本流，避免缩进过大 - 如果用了自定义字体或小字号，注意
line-height别设太小，否则编号和文字上下错位 - 不要用
text-align: justify或强制white-space: nowrap，会破坏步骤可读性
需要「1.1」「2.3」这种带父级前缀的编号？原生 ol 做不到，得用 CSS counters
HTML <ol></ol> 只提供扁平数字，不生成层级前缀。所谓“1.1”本质是 CSS 计数器拼接的结果，不是语义化结构。
真要实现，必须用 CSS counter-reset + counter-increment + ::before 伪元素手动拼接：
ol { counter-reset: section; }
ol li { counter-increment: section; }
ol li::before { content: counters(section, ".") ". "; }
- 这个方案不改变 HTML 结构，但丧失了屏幕阅读器对原生序号的识别能力
- 如果导出 PDF 或打印，部分浏览器不渲染 CSS 伪元素，编号可能消失
- 更稳妥的做法：用纯文本前缀（如
<li> <strong>2.3</strong> 保存配置文件…</li>），放弃自动计数
语义重要还是样式重要？说明书优先用 <ol></ol>，别为了好看换 <div>
<p>有人图省事用一堆 <code><div> + 手动写 “1.” “2.”，结果搜索引擎和读屏软件完全无法识别这是有序步骤。说明书类内容恰恰最需要语义清晰。
<ul>
<li>哪怕编号样式丑一点，先确保用 <code><ol><li></ol> 包住每条操作指令
<ol></ol> 标签<ol></ol>，说明它不合规，该换工具，而不是迁就它层级编号看着简单，但一牵扯导出、适配、无障碍，start 和 counter 的边界很容易模糊。实际写说明书时，多数场景用好 start + list-style-position 就够了，别过早卷进 CSS counters 的嵌套逻辑里。
