start属性可让有序列表从任意整数起始编号,如10、0或负数,自动递增且语义正确;但仅控制起点,不支持非连续编号,此时需CSS计数器或JS实现。

使用 start 属性直接指定起始序号
HTML 有序列表默认从 1 开始,但不需要手动写 <li> 里塞编号或用 CSS 计数器绕弯子。原生支持的 start 属性就能让 <ol> 从任意整数开始——包括 10。
注意:start 的值是数字,不是字符串;它影响的是渲染序号,不改变 DOM 结构或语义。
-
<ol start="10"><li>第十项</li><li>第十一项</li></ol>会显示为 “10. 第十项”、“11. 第十一项” - 若后续追加
<li>,编号自动递增(即第 12、13…),无需额外处理 - 不兼容老版本 IE(IE9+ 支持),但现代所有主流浏览器都无问题
当需要跳过中间编号或非连续时不能只靠 start
start 只控制起点,无法实现“10、11、15、16”这种跳跃。此时必须放弃纯 HTML 方案,改用 CSS 计数器或 JS 控制。
例如,想让前三项是 10–12,后两项是 15–16,就得用 counter-reset 和 counter-increment 配合 ::before 模拟编号,或者给每个 <li> 加 data-index 并用 JS 渲染。
立即学习“前端免费学习笔记(深入)”;
- 纯
start对非连续编号无效,强行用会误导辅助技术(如屏幕阅读器) - 若内容逻辑上本就是分段编号(如文档章节续编),建议拆成多个
<ol>,各自设start - CSS 计数器方案需确保
counter-reset在父容器正确初始化,否则序号错乱
start 值为负数或零时的行为
HTML 规范允许 start 为任意整数,包括 0 和负数。浏览器实际渲染时,序号仍按数学顺序递增,但显示形式取决于 type 属性。
-
<ol start="-2" type="1"><li>a</li><li>b</li></ol>显示为 “-2. a”、“-1. b” -
<ol start="0" type="a"><li>first</li></ol>在 Chrome/Firefox 中显示为 “a. first”,即字母表从第 0 个位置开始(等价于a),但这个行为未被所有浏览器严格统一 - 依赖负数或零起始时,务必在目标浏览器中实测,尤其涉及
type="i"或type="A"等字母型编号
start 是最轻量、最语义正确的解法,但它的能力边界很清晰:只管起点,不管中间断点,也不管样式变形。一旦需求越过这条线,就得切换思路。



















