value属性仅对<ol>内的<li>有效，设值后强制重置后续序号并线性自增，无法填补空档；对<ul>无效；与CSS计数器相比属破坏性干预，缺乏灵活性和语义控制。
value 属性在 <li> 标签中确实能改变单个列表项的序号，但它只对 <ol> 内部的 <li> 有效，且会直接重置后续所有项的计数——这不是“微调”，而是“硬切”。
为什么 value 会让后续序号突然跳变
浏览器对 <ol> 的计数逻辑是线性的：从第一个 <li> 开始累加，遇到 value 就强制设为该值，然后继续自增。它不关心语义是否连贯，只执行指令。
常见错误现象：
- 写
<li value="5">第五项</li>后，下一项自动变成 “6.”，哪怕你本意是“续接原序列” - 多个
value并存时，序号变成 1 → 5 → 6 → 10 → 11，中间空档无法填补 -
value对<ul>完全无效，写了也不报错，但毫无作用
value 和 CSS 计数器的根本区别
value 是 HTML 层面的显式覆盖，属于“破坏性干预”；CSS 计数器（counter-reset/counter-increment）是渲染层的声明式控制，可叠加、可条件触发、可格式化。
立即学习“前端免费学习笔记（深入）”；
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
使用场景差异：
- 需要临时跳过几项（如“第1章”“第3章”，中间缺2），
value最快，但不可逆 - 要生成 “Step-001”“Item-B-02” 或跨多个
<ol>共享计数，必须用 CSS 计数器 - 想让某项“不参与计数”（比如标题行），
value做不到，得靠counter-increment: none
移动端或复杂嵌套里 value 容易失效的原因
不是 bug，是规范行为：当 <li> 没被正确包裹在 <ol> 内（比如嵌套结构非法、父级被浏览器自动闭合），value 就失去上下文，退化为普通属性。
排查要点：
- 用浏览器开发者工具检查 DOM 实际结构，确认
<li value="x">真的是<ol>的直接子元素 - 避免在
<li>内再写<ol>或<ul>而不包在子<li>里——这会导致外层<ol>被截断，value失效 -
value只接受整数，传"5.0"或"five"会被忽略，回退到默认计数
真正难处理的从来不是“怎么设序号”，而是“怎么让序号在嵌套、响应式、多语言环境下稳定不崩”。value 是把锤子，但多数时候你面对的不是钉子。
