最简有序列表为第一项第二项第三项，浏览器自动用1.2.3编号；start属性指定起始数字，reversed实现倒序显示，二者可共存；禁用type属性，改用css的list-style-type控制样式。
用 <ol></ol> 和 <li> 写最简有序列表
HTML 里没有“自动编号”这种独立功能，有序列表的本质就是语义化容器 + 浏览器默认渲染规则。只要套对标签，编号就出来，不用写 CSS 或 JS。
最简写法：
<ol> <li>第一项</li> <li>第二项</li> <li>第三项</li> </ol>
浏览器会默认用阿拉伯数字（1. 2. 3.）渲染，且自动递增。注意：<ol></ol> 必须直接包 <li>，不能中间插 <p></p> 或文本；否则解析可能出错或降级为无序列表。
start 和 reversed 属性的实际用途
这两个属性不常被需要，但真用到时很关键——比如文档续写、倒序步骤说明，或对接后端分页数据（起始序号不是 1）。
-
start="5"：让列表从 5 开始编号，后续仍按顺序递增（5, 6, 7…），不是跳过前 4 项 -
reversed（布尔属性，无需赋值）：仅影响视觉顺序，编号从大到小（如 3, 2, 1），但 DOM 顺序不变，<li>的书写顺序仍是正向的 - 二者可共存：
<ol start="10" reversed></ol>会显示 10, 9, 8…，适合“剩余步骤倒计时”类场景
别用 type 属性强行改编号样式
type（如 type="A"、type="i"）是遗留属性，HTML5 中已不推荐。它只控制字母/罗马数字形式，但行为不可靠：
- 在部分浏览器中，
type="a"可能被忽略，回退到数字 - 无法控制大小写（
avsA）、是否加点（a.vsa)） - 嵌套列表中，
type不会自动切换层级样式（比如外层数字、内层字母），而 CSS 的list-style-type可以精准控制
真要换样式，请用 CSS：ol { list-style-type: upper-alpha; }，更稳定、可继承、可响应式。
嵌套有序列表的结构陷阱
嵌套本身没问题，但容易写错层级或漏掉标签，导致编号中断或重置。
- 必须严格闭合：每个
<ol></ol>都要配，不能靠缩进“猜”结构 - 子列表应放在父
<li>内部，而不是同级：<ol> <li>主步骤一 <ol><li>子步骤</li></ol> </li> <li>主步骤二</li> </ol> - 浏览器对嵌套的默认行为是：外层数字，内层小写字母，再内层小写罗马数字——但这是 UA 样式，不是规范强制，别依赖它做关键 UI
编号逻辑由浏览器实现，不是 HTML 自身计算；如果看到编号乱了，优先检查标签是否匹配、是否意外被 CSS 重置了 counter-reset。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
