不推荐依赖 <ol> 的 start 属性，因其兼容性差、易被 CSS/JS 干扰、无法响应动态数据；应优先使用 CSS counter-reset 或组件内索引计算。
HTML 中 <ol> 的 start 属性是否可靠？
不推荐依赖 start 属性控制起始编号，尤其在现代前端工程中。它虽是 HTML 标准属性，但存在明显兼容性与语义风险：IE 低版本支持不稳定；当列表被 CSS 重置（如 list-style: none）或 JS 动态操作后，start 值常被忽略；更关键的是，它无法响应动态数据变化——比如分页列表第二页想从 26 开始，硬编码 start="26" 容易出错且难维护。
用 CSS counter-reset 替代 start 更可控
CSS 计数器方案能完全接管编号逻辑，不受 HTML 结构变动影响，也便于条件化控制。核心是组合使用 counter-reset 和 counter-increment：
<ol class="custom-ol" style="--start: 10;"> <li>第一项</li> <li>第二项</li> </ol>
.custom-ol { counter-reset: item calc(var(--start) - 1); }<br>.custom-ol > li { counter-increment: item; }<br>.custom-ol > li::before { content: counter(item) ". "; }
-
counter-reset的第二个参数支持表达式，calc(var(--start) - 1)是关键——因为counter-increment每次先加再显示，所以初始值要减 1 才能对齐预期起点 - 用 CSS 自定义属性（
--start）传值，方便 JS 动态修改：el.style.setProperty('--start', '42') - 该方案在所有现代浏览器中行为一致，且不会干扰屏幕阅读器对
<ol>的语义识别
React/Vue 等框架里别写死 start，用索引生成
在组件化场景下，编号本质是数据索引的映射，直接用循环变量最稳妥：
{items.map((item, index) => (
<li key={item.id}>
<strong>{startIndex + index + 1}.</strong> {item.text}
</li>
))}-
startIndex是外部传入的起始偏移量（如分页时为(page - 1) * pageSize） - 避免在 JSX/Template 中写
<ol start="{startIndex + 1}">—— Vue 的响应式更新可能让start属性失效；React 中它属于非标准 DOM 属性，可能被忽略 - 若需保留
<ol>语义，可在外层包一层<ol>，内部用<li>手动渲染编号，此时start属性已无意义
遇到 start 不生效时优先查这三件事
如果坚持用原生 start 却发现编号还是从 1 开始，大概率是以下原因：
- CSS 中存在
ol { counter-reset: list-item; }或类似重置规则，强行覆盖了 HTML 的start - 列表项用了
display: contents或display: flex，导致<li>不再参与计数器继承链 - 浏览器 DevTools 里检查元素，发现
<ol>节点上实际没渲染出start属性（比如 Vue 模板编译后丢失，或 JS 创建元素时未设setAttribute('start', '5')）
真正需要精确控制编号起点时，CSS 计数器或手动索引是更少意外的选择。HTML start 属性只适合静态、简单、无需维护的页面片段。
