ol标签通过start属性指定首项编号值（仅整数），reversed属性实现视觉倒序编号但不改变dom顺序，二者共存时编号按start起始并递减，且均不影响语义与可访问性。
有序列表的排序不是靠“写代码”实现的，而是靠 ol 标签自带的计数逻辑和几个关键属性控制——你不需要手写数字、也不需要 JavaScript 就能改变起始值或方向。
为什么 ol 的数字突然从 3 开始？
因为 start 属性直接指定第一个 li 的编号值。它接受整数（正负都行），不支持小数或字母。
- 写
<ol start="5"> <li>苹果</li> <li>香蕉</li> </ol>→ 显示为 “5. 苹果”、“6. 香蕉” -
start不影响语义或可访问性，屏幕阅读器仍按实际顺序读取 - 如果后续嵌套了
ol，内层默认从 1 开始，不受外层start影响
reversed 属性到底反转什么？
它让编号倒序排列，但只改变视觉顺序，不改变 DOM 结构或语义顺序——li 还是按书写顺序渲染，只是编号从大到小。
-
<ol reversed> <li>A</li> <li>B</li> <li>C</li> </ol>显示为 “3. A”、“2. B”、“1. C” - 和
start可以共存：<ol start="10" reversed></ol>→ 第一项显示 “10”，第二项 “9”，依此类推 - 注意：部分旧版 IE 完全不支持
reversed，如需兼容，得用 CSS 或 JS 模拟
想用字母或罗马数字编号？别硬改 HTML
用 CSS 的 list-style-type 控制样式，HTML 仍保持语义清晰的 ol + li 结构。
- 小写字母：
<ol style="list-style-type: lower-alpha;"></ol> - 大写罗马：
<ol style="list-style-type: upper-roman;"></ol> - 这些值只影响显示，不影响
start或reversed的行为 - 不要用
type属性（如<ol type="A"></ol>）——它是过时的 HTML4 属性，浏览器支持混乱且不可预测
真正容易被忽略的是：编号样式（字母/罗马）和起始值（start）在 CSS 中无法联动——比如你设了 upper-roman，又设 start="4"，浏览器会把 4 转成 IV，但不会自动把第 5 项算作 V；它只是按顺序递增，这点和数字编号逻辑一致。实际项目中，如果需要复杂编号规则（比如跳过某几项、混合类型），就得换思路：用定义列表 dl 或手动加 span 模拟。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
