value属性仅重置<li>计数起点，不影响显示样式；实现自定义编号须用list-style:none配合::before伪元素和content。
OL 的 value 属性只对 <li> 生效，不控制显示样式
直接设置 <li value="5"> 是合法的，但它仅影响后续 <li> 的**计数起点**，不是“自定义显示编号”。浏览器仍按 ol 的 type（如 1、A、i）生成序号，value 只是重置计数器值。比如：
<ol><li value="3">第三项</li><li>第四项</li></ol>会显示为 “3. 第三项”、“4. 第四项”，而非 “3. 第三项”、“3. 第四项”。
想让每个 <li> 显示完全自定义的编号（如“Step-01”、“⚠️ 2”），必须禁用默认计数
靠 value 无法实现任意文本编号。正确做法是：
- 给
<ol>加list-style: none（CSS 中移除默认序号） - 用
::before伪元素 +content插入你想要的任意字符串 - 若需保留顺序逻辑，可用
counter-increment配合counter()，但最终显示内容仍由content决定
<ol class="custom-steps"><li>初始化</li><li>验证</li></ol>
.custom-steps { list-style: none; }<br>.custom-steps li::before {<br> content: "Step-" attr(data-step) " ";<br> font-weight: bold;<br>}<br><!-- 使用时：<li data-step="01">初始化</li> -->
value 属性在嵌套或中断续编时容易误用
常见误解是认为 value 能“跳过中间项”或“恢复断点”，但它的行为依赖于浏览器对计数器的维护逻辑：
- 如果前面有
<li value="10">，后面没设value的<li>会从 11 开始，而不是从 1 继续 - 在
<ol reversed>下，value表示该项的“起始降序值”，不是绝对位置 - 多个并列
<ol>之间互不影响计数器，value不跨列表生效 - 若用 JS 动态插入
<li>，value不会自动重算，需手动维护
<ol><li>一</li><li value="5">五</li></ol>——这不会让第二项显示为 “5.” 并跳过 2–4，而是让第二项成为第 5 项，且没有第 2–4 项对应 DOM 节点，视觉上就是 “1. 一”、“5. 五”，中间空缺。
真正需要“任意编号字符串”时，别碰 value，用 CSS 或内联标记更可靠
除非你明确需要语义化序号（如辅助技术读出“第7项”），否则硬塞非数字/非序列内容到 value 里既无效也不合法（HTML 规范要求 value 是整数）。实际项目中：
- 纯展示需求 → 用
<span class="num">⚠️ 2</span>+ CSS 控制布局 - 需语义+样式分离 → 用
aria-label或data-*属性存原始编号，CSS::before渲染视觉内容 - 动态生成列表 → 在 JS 中拼接编号字符串，或用模板引擎注入，比依赖
value更可控
value 的解析非常机械，而人眼看到的“编号”和 DOM 中的“计数器状态”根本不是一回事——这点最容易被忽略。 
