应使用 <ol> 标签包裹制作流程步骤，因其语义准确、兼容性好、自动编号且支持无障碍；错误做法包括误用 <ul> 或 <p>、在 <ol> 中混入非 <li> 元素；跨页流程用 start 属性接续编号，嵌套子步骤不超过两层，编号样式应通过 CSS list-style-type 控制。
用 <ol> 包裹步骤，浏览器自动编号
制作流程天然有先后顺序，<ol> 是语义最准确、兼容性最好的选择。它默认从 1 开始递增编号，无需额外写序号，也避免手输错误或重排错乱。
常见错误是误用 <ul> 或纯 <p> 堆叠——前者丢失顺序语义，后者无法被屏幕阅读器识别为流程，对无障碍和 SEO 都不利。
- 每个步骤必须用
<li>包裹，不能直接写在<ol>里 -
<ol>内部不能混入<div>、<p>等非列表项标签 - 如果流程跨多页或分阶段，别强行塞进一个
<ol>，应按逻辑拆成多个独立<ol>
start 属性接续编号，别硬改 HTML 文本
当流程被中断（比如“步骤 1–3”在一页，“步骤 4–6”在下一页），用 start="4" 比手动把第四项写成 “4. …” 更可靠——它保持 DOM 顺序，CSS 也能继续生效，打印或爬虫解析时不会出错。
注意：start 只接受整数，不支持小数或字母；若需 “Step A” 开头，应改用 CSS 的 list-style-type，而非依赖 type="A"（该属性已过时，部分新浏览器可能忽略）。
立即学习“前端免费学习笔记（深入）”；
-
<ol start="4">→ 编号从 4 开始：4, 5, 6… -
<ol start="-1">无效，会被浏览器忽略或重置为 1 - 嵌套子流程（如“3.2 准备模具”）不靠
start，而应使用 CSS 计数器或单独<ol>
用 CSS 的 list-style-type 控制编号样式，不是 type 属性
HTML 的 type 属性（如 type="a"）已被 HTML5 标记为过时，现代项目应统一用 CSS 控制。这样更灵活，也便于主题切换或响应式适配。
例如，教程类页面常用小写字母，而正式文档倾向大写罗马数字；这些都可通过一行 CSS 调整，无需动 HTML 结构。
-
ol { list-style-type: lower-alpha; }→ a, b, c… -
ol { list-style-type: upper-roman; }→ I, II, III… -
ol { list-style-type: none; }+ 自定义伪元素编号，适合复杂前缀（如 “STEP 1”）
嵌套子步骤时，避免超过两层 <ol>
真实制作流程常含子步骤（如“2. 烘焙 → 2.1 预热烤箱 → 2.2 调节温度”），可用嵌套 <ol> 实现，但建议不超过两层。
三层以上嵌套会显著降低可读性，且多数屏幕阅读器对深层嵌套支持不佳。更稳妥的做法是：主流程用 <ol>，子动作改用 <ul> 或 <details> 折叠，保持主干清晰。
- 正确嵌套：
<ol><li>主步骤<ol><li>子步骤</li></ol></li></ol> - 避免：
<ol><li><ol><li><ol>…</ol></li></ol></li></ol> - 子步骤含顺序？那就不是“子”，而是主流程的下一项，应拉平层级
<ol>，辅助技术仍会将其解释为有序结构。这点在制作可访问性要求高的操作指南时尤为关键。 
