默认显示阿拉伯数字（1, 2, 3…），无需额外设置；用start="5"可从第5项开始编号；value作用于单个并影响后续项，易致重复；隐藏后几项编号需用css :nth-of-type(n + 6) 配合 list-style-type: none；序号由浏览器渲染，不可通过js读取或修改文本内容。
直接用 <ol></ol> 就能生成带数字序号的列表，不需要额外写 JS 或手动编号；浏览器默认从 1 开始递增，语义正确、无障碍友好、SEO 友好。
如何让 <ol></ol> 显示阿拉伯数字（1, 2, 3…）
这是默认行为，什么都不用设就自动生效：
-
<ol></ol>标签本身即表示“有序”，浏览器自动使用decimal类型编号 - 无需加
type="1"或list-style-type: decimal—— 多余且可能干扰继承样式 - 如果页面全局重置了
ol的list-style-type，才需要显式恢复：list-style-type: decimal;
怎么从第 5 项开始编号（如 5, 6, 7…）
用 start 属性最简单，它作用于整个 <ol></ol>，后续所有 <li> 自动按此起始值递增：
-
<ol start="5"></ol>→ 第一项显示为 “5.”，第二项为 “6.”，依此类推 - 该属性只影响视觉编号和可访问性读出的序号，不改变 DOM 结构或 JS 中的索引
- 注意：不要混用
start和value在同一列表中，容易导致序号跳变或重复
为什么 value 属性有时不生效
value 是作用在单个 <li> 上的，但它只影响“当前项及其后续项”的编号逻辑，不是独立设置——容易误用：
-
<li value="8">第八项</li>后面的<li>会变成 9、10…，但前面的项不受影响 - 若在中间某项设
value="3"，而前面已有 4 项，则会出现 “1. 2. 3. 3. 4.” 这类重复编号 - 真正需要跳号（比如跳过敏感步骤）时，
value才有意义；日常顺序编号请优先用start
隐藏部分编号（如只显示前 5 项数字）
这不是靠 HTML 属性，而是纯 CSS 控制显示逻辑：
- 必须用
<ol></ol>，不能用<ul></ul>+counter()模拟——否则语义丢失、读屏器无法识别顺序 - 关键规则：
.my-list li:nth-of-type(n + 6) { list-style-type: none; } - 这个选择器精准匹配第 6 个及之后的
<li>，隐藏其编号，但保留 DOM 顺序和可访问性序号（第 7 项仍被读作“第 7 项”） - 如果列表项内有块级元素或 padding 不一致，建议加
margin-left: 0;或统一缩进，避免视觉错位
最容易被忽略的一点：序号是浏览器渲染层的行为，不是 HTML 文本内容。所以别试图用 JS 去“读取”或“修改”序号数字——它不在 DOM 文本节点里，也不响应 textContent 变化。要控制编号，始终优先走 HTML 属性（start、value）或 CSS（list-style-type、:nth-of-type）路径。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
