HTML原生的type属性可直接设置编号类型（如type="I"为大写罗马数字），嵌套时子须作为的直接子元素，且type在HTML5中对所有层级有效；CSS的list-style-type会覆盖type属性，但需手动调整缩进；无障碍方面，type仅影响视觉，不增强语义。
ol 的 type 属性控制数字/罗马样式
HTML 原生 <ol></ol> 支持通过 type 属性切换编号类型，无需 CSS 就能实现层级嵌套的样式差异。最外层用阿拉伯数字，内层用罗马数字，直接在嵌套的 <ol></ol> 上加 type="I" 或 type="i" 即可。
注意：HTML5 中 type 属性仅对顶层 <ol></ol> 有效，但对子 <ol></ol> 同样生效——只要它不是被 CSS 的 list-style-type 覆盖掉。
-
type="1"（默认）→ 1, 2, 3 -
type="A"→ A, B, C -
type="a"→ a, b, c -
type="I"→ I, II, III（大写罗马） -
type="i"→ i, ii, iii（小写罗马）
嵌套 ol 必须用合法结构：li 包裹子 ol
常见错误是把 <ol></ol> 直接写在父 <ol></ol> 内部，跳过 <li> —— 这会导致 DOM 结构损坏，浏览器可能自动闭合或重排，罗马数字失效或序号错乱。
正确写法是：每个子 <ol></ol> 必须作为某个 <li> 的**直接子元素**。
立即学习“前端免费学习笔记（深入）”；
把任意文章或文档内容转换成精美的全屏翻页 HTML 演示文件（幻灯片风格）。当用户发来一篇文章、文档链接、Markdown 内容、或粘贴的文本，并且希望生成演示用的 HTML 时触发。支持任意内容来源：iWiki 链接、KM 链接、本地文件路径、直接粘贴的文本。生成的 HTML 文件保存到本地工作区，并通过企微直接发送给用户。触发词示例：帮我把这篇文章做成PPT、转成演示文档、生成HTML幻灯片、做个演示、转成可以演示的格式、article to deck、make a slide。
<ol>
<li>第一项
<ol type="I">
<li>子项 I</li>
<li>子项 II</li>
</ol>
</li>
<li>第二项</li>
</ol>
type 属性与 CSS list-style-type 的优先级关系
如果同时写了 type="I" 和 CSS list-style-type: lower-roman，CSS 会覆盖 HTML 的 type。但更关键的是：一旦用了 list-style-type，就必须配 list-style-position 和 padding-left 手动调齐缩进，否则罗马数字容易贴着文字或悬空。
- 纯 HTML 方案（推荐初用）：只靠
type，零 CSS，兼容性好（IE8+） - 需要小写罗马或自定义起始值时：用
start+type，比如<ol type="i" start="3"></ol> - 若必须用 CSS 控制：确保子
<ol></ol>的父<li>没有display: inline等破坏块级结构的样式
移动端或无障碍场景下的注意事项
屏幕阅读器通常按 DOM 层级读出序号，但不会主动播报 “罗马数字” 或 “大写 A”，只读数值（如 “1”, “2”）。所以 type="I" 对语义无增强，仅影响视觉呈现。
真正影响可访问性的，是嵌套深度和 <li> 是否包裹完整。漏掉 或多层嵌套未闭合，会导致阅读器跳项或重复读。
另外，iOS Safari 对 type="i" 渲染偶尔不一致（尤其配合 reversed 时），稳妥起见，大写罗马（I）比小写（i）兼容性更高。
嵌套层级深了之后，罗马数字很快变成 XII、XXVII，人眼难速读——这不是技术限制，而是设计信号：该考虑是否真需要三层以上纯数字嵌套了。
