start属性指定有序列表首个li的起始编号值,仅影响视觉序号而不改变dom结构或语义顺序;值必须为整数(正、负、零均可),非整数字符串会退化为1,嵌套ol中不继承,css counter-reset优先级高于start。

HTML 中 <ol></ol> 的 start 属性到底怎么用
直接说结论:start 属性能指定有序列表第一个 <li> 的编号值,但它只影响视觉序号,不改变 DOM 结构或语义顺序。浏览器支持良好,但要注意它对嵌套列表和 CSS 计数器的干扰。
start 值不是字符串而是整数,别传 "2" 或 "02"
传错类型会导致回退到默认起始值 1(尤其在旧版 Safari 或严格解析模式下)。
-
start="5"✅ 正确:数字字符串会被转为整数 -
start="05"⚠️ 风险:部分浏览器可能截断前导零,变成 5;但语义上仍是整数,不是字符串 -
start="two"❌ 失效:非数值字符串被忽略,列表从 1 开始 -
start="-3"✅ 合法:负数也允许,会显示 -3, -2, -1, 0, 1…
嵌套 <ol></ol> 时 start 不继承,每层独立计算
外层 start="10" 不会影响内层编号起点,内层仍默认从 1 开始——除非你显式给内层也加 start。
<ol start="10"> <li>第十项</li> <ol> <li>这里还是 1(不是 11)</li> </ol> </ol>
如果想让子列表接续父列表编号,得手动算:<ol start="11"></ol>,或者改用 CSS counter-increment 控制,更灵活也更可控。
和 CSS counter-reset/counter-increment 冲突时,谁赢?
CSS 计数器优先级高于 HTML start。一旦你在 <ol></ol> 上写了 counter-reset: item 5,start 就被覆盖了。
- 纯 HTML 场景:用
start最简单 - 需要动态控制、跨列表连续编号、或响应式重置:必须用 CSS counter
- 混合使用时记得测试:Chrome 和 Firefox 行为一致,但某些 WebView(如早期 Android 系统)可能忽略 CSS 覆盖
真正容易被忽略的是:屏幕阅读器通常按 DOM 顺序播报编号,而 start 只改显示值——如果编号逻辑和内容语义脱节(比如 start="100" 但实际是第 3 个步骤),可访问性就出问题了。











