标签必须显式闭合，用于表达有内在先后关系的内容；start和reversed属性仅对有效；嵌套时优先排查css重置而非list-style设置。
ol 标签必须显式闭合，别信“浏览器能自动补”
写 <ol>
<li>第一步</li>
<li>第二步</li>
</ol> 却漏掉 ，浏览器虽会容错渲染，但 DOM 结构可能错乱。Vue/React 模板里直接报错；服务端渲染（如 EJS、Nunjucks）中条件分支一漏，整个页面 HTML 树就断裂；document.querySelectorAll('li') 可能少取节点，甚至把文本内容误判为列表项。
用 <ol></ol> 不是为了显示数字，而是表达顺序语义
是否该用 <ol></ol>，只看内容有没有内在先后关系，和要不要“看起来带编号”无关：
- 安装步骤、法律条款、搜索结果排名、食谱操作顺序 → 必须用
<ol></ol> - 导航菜单（首页 / 产品 / 关于我们）→ 通常用
<ul></ul>，除非你真在描述用户“必须按此流程访问”的路径 - 表单校验错误提示（密码太短、邮箱格式错误）→ 用
<ul></ul>，错误项之间无执行顺序
硬套 <ol></ol> 只为视觉编号，屏幕阅读器会读成“第1项、第2项…”，造成语义污染——后期做无障碍审计时返工成本远高于初始选对。
start 和 reversed 属性只对 <ol></ol> 有效，<ul></ul> 不支持
start="5" 让列表从 5 开始编号，reversed 让编号倒序（如 <ol start="5" reversed></ol> 渲染为 5. 4. 3. 2. 1.）。这两个属性是原生、轻量、兼容性好的方案，比用 CSS counter-reset 更稳妥。
注意：type 属性（如 type="A"）仅支持有限值（1/A/a/I/i），不支持 emoji、图标或前缀（如 “Step 1.”），现代项目应优先用 CSS 的 list-style-type 或 ::before 伪元素控制样式。
嵌套 <ol></ol> 时，缩进失效大概率不是 list-style 的问题
三层以上嵌套基本等于放弃可维护性。子列表没缩进？先查父级 <ol></ol> 的 padding-left 是否被全局 CSS 重置了（比如 * { padding: 0; }），而不是急着调 list-style-position。
更隐蔽的坑：list-style-position: inside 会让换行文字缩进不对齐，生产环境慎用；嵌套列表若含解释性内容（如“支付方式 → 支付宝：支持花呗”），更适合改用 <dl></dl> 或 <details></details>，而非强行塞进 <ol></ol>。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
