有序列表必须用包裹，浏览器自动编号；start控制起始值，reversed实现倒序，type属性已过时，推荐用css的list-style-type控制样式，嵌套需在内包含。
有序列表必须用 <ol></ol> 包裹 <li>
HTML 有序列表不是靠手动写“1. 2. 3.”实现的，而是由语义化标签结构定义的：<ol></ol> 是容器，<li> 是唯一合法子元素。浏览器自动编号，屏幕阅读器据此识别顺序关系。
常见错误现象包括：
- 在
<ol></ol>里直接放文本或<p></p>—— 这会破坏语义，部分浏览器可能忽略编号或报解析警告 - 漏写
<li>，比如写成<ol>第一步</ol>—— 实际渲染时无编号，且不符合 HTML 规范 - 把
<ul></ul>当<ol></ol>用，仅靠 CSS 改数字样式 —— 丢失语义，对可访问性和 SEO 不友好
start 和 reversed 属性影响编号逻辑
这两个属性直接修改浏览器生成编号的行为，不依赖 CSS。它们的作用是结构性的，而非视觉修饰。
-
start="5"：从数字 5 开始编号（<ol start="5"><li>内容</li></ol>→ 显示为 “5. 内容”） -
reversed：倒序编号（<ol reversed> <li>A</li> <li>B</li> </ol>→ 显示为 “2. A” “1. B”） - 二者可共存：
<ol start="3" reversed></ol>会从 3 开始倒数（如 3、2、1） - 注意：
reversed是布尔属性，写成reversed=""或reversed="reversed"都有效，但只需出现即生效
type 属性与 CSS list-style-type 的区别
type 是 HTML 属性，仅支持有限取值（"1"、"a"、"A"、"i"、"I"），且在现代开发中已被视为过时实践；而 CSS 的 list-style-type 更灵活、可继承、可响应式控制。
- HTML
type="a"和 CSSlist-style-type: lower-alpha效果相同，但后者优先级更高，会覆盖前者 -
type无法实现自定义前缀（如 “Step 1.”）、多级嵌套差异化编号（如 1.1, 1.2），这些必须用 CSS counters - 若需兼容老旧环境（如某些邮件客户端），
type仍有兜底价值，但日常网页开发应默认用 CSS 控制
嵌套有序列表时，<li> 必须包含子 <ol></ol>
嵌套不是靠缩进或空格实现的，而是靠 <li> 内部再包裹一个完整的 <ol></ol> 结构。否则嵌套关系断裂，编号重置或错乱。
正确写法示例：
<ol>
<li>主步骤一
<ol>
<li>子步骤 a</li>
<li>子步骤 b</li>
</ol>
</li>
<li>主步骤二</li>
</ol>
容易踩的坑：
- 把子
<ol></ol>放在<li>外面 —— 浏览器会闭合当前<ol></ol>，导致编号从 1 重新开始 - 遗漏外层
<li>，直接写<ol> <li>...</li> <ol>...</ol> </ol>—— 第二个<ol></ol>被视为同级，非嵌套 - 以为嵌套后编号自动变成 “1.1” —— 实际默认仍是独立序列，需 CSS 手动实现层级编号
真正难的不是写对标签，而是理解编号行为何时由 HTML 属性驱动、何时由 CSS 驱动、何时由嵌套结构隐式决定——这三者混用时，优先级和重置逻辑最容易出错。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
