ol 的 start 属性可直接设置起始数字，支持正负零整数，优先级高于 CSS counter-reset，但不适用于字母或罗马数字样式，且受 CSS 隐藏或布局影响。

start 属性在 ol 中直接设起始数字

HTML 的 ol 元素原生支持从任意整数开始编号，用的就是 start 属性。它接受一个整数（正、负、零都行），浏览器会据此生成第一个 li 的序号，后续项自动递增。

常见错误是以为必须配合 CSS 或 JS 才能改起始值，其实纯 HTML 就够了：

<ol start="10">
<li>第十项内容</li>
  <li>第十一项内容</li>
</ol>

• start 值不校验是否匹配实际 li 数量，哪怕只有 1 个 li，设 start="999" 也会显示 “999.”
• 值会被强制转为整数：start="5.8" → 实际从 5 开始；start="abc" → 退化为默认 1（无报错但失效）
• 不支持小数、字母或自定义字符串（如 “A”、“i”），那些得用 CSS 的 list-style-type + counter-reset

start 和 CSS counter-reset 混用时谁生效？

当 ol 同时有 start 属性和 CSS 的 counter-reset 时，start 优先级更高 —— 浏览器会先按 start 初始化计数器，再应用 CSS 重置（如果存在）。

也就是说：counter-reset 会覆盖 start，但前提是它写得明确且作用域正确：

ol { counter-reset: list-item 20; }

• 上面这行会让所有 ol li 从 21 开始（因为 counter-reset 设的是“下一个将用的值”，不是当前值）
• 如果只写 counter-reset: list-item;，则清空计数器，回到默认 1，start 彻底失效
• 想保留 start 的语义又微调样式？别碰 counter-reset，直接用 start 更轻量、更可预测

React/Vue 等框架里动态设置 start 安全吗？

安全，但要注意属性名写法。JSX 中要用 start（不是 startValue 或 defaultStart），Vue 模板中也直接写 start：

<ol start="{currentStart}">...</ol>

• React 中 start 是标准 HTML 属性，会透传到 DOM，无需特殊处理
• 值必须是 number 类型，传 string（如 "5"）也能工作，但建议显式转成 Number() 避免意外截断
• 服务端渲染（SSR）下，start 会正常输出，不依赖 JS 运行时
• 慎用在条件渲染的 ol 上：如果 start 值在列表更新时突变（比如从 3 变成 100），视觉上序号会跳变，但 DOM 结构没重绘，可能引发可访问性工具误读

start 不起作用的三个典型原因

写了 start="7" 却还是从 1 开始？大概率掉进以下坑里：

• 父元素或自身有 list-style: none 或 display: flex —— 序号本身被隐藏或布局破坏，start 仍在生效，只是看不见
• 用了自定义 list-style-type（如 lower-alpha）却期望数字起始值生效 —— start 对字母/罗马数字序列无效，它只影响计数逻辑，而字母表没有“第 7 个字母之后自动接第 8 个”的内置映射
• 浏览器兼容性没问题（Chrome/Firefox/Safari/Edge 全支持），但你在调试时忘了刷新，或者编辑器实时预览未触发 HTML 重载

最简单的验证方式：临时删掉所有 CSS，只留裸 ol + start，看是否立刻生效。如果这时对了，问题一定出在样式层，而不是 start 本身。