HTML有序列表嵌套无序列表教程-html教程-PHP中文网

ol 直接嵌套 ul 合法，但 ul 必须位于 li 内部；div 不得作为 ol 的直接子元素，否则破坏结构；嵌套不影响 ol 编号逻辑，ul 无编号需 css 控制；多层嵌套建议不超过两层。

html有序列表嵌套无序列表教程

ol 里直接嵌套 ul 是完全合法的，浏览器原生支持，不需要额外 hack。但实际写错的地方，90% 出现在结构层级或语义误用上。

为什么 `ol` 里面能放 `ul`，但不能放 `div`

HTML 规范明确允许 ol 的直接子元素是 li，而 li 内部可以包含「流内容」——ul、p、span 都算，但 div 不是流内容的直接合法子元素（除非在 HTML5 的特定上下文中被显式允许，而列表项里并不默认允许）。常见错误是这样写：

<ol>
<li>第一步</li>
  <div><ul><li>子步骤a</li></ul></div>
  <li>第二步</li>
</ol>

这会导致解析异常，浏览器可能把 div 提升到 ol 外，破坏嵌套关系。正确做法是所有嵌套内容必须包裹在 li 里：

确保每个 ul 都位于某个 li 内部
不要让 ul 或 ol 成为 ol 的直接子元素（跳过 li）
li 标签可以闭合也可以不闭合（HTML5 允许省略结束标签），但嵌套时建议显式写

`ol` + `ul` 嵌套时的编号继承问题

嵌套本身不会影响外层 ol 的编号逻辑，但容易让人误以为子列表会「续编」。实际上：ul 没有编号，它的符号由 CSS 的 list-style-type 控制；外层 ol 的 start 或 value 属性对内层 ul 完全无效。

Article To Html

文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。

下载

如果需要「1.1、1.2」这类编号，纯 HTML 无法实现，得靠 CSS counters 或 JS 生成
想让子列表从特定数字开始？只能在外层 li 里手动用 ol start="3"，和父级无关
用 reversed 或 type="A" 的 ol 嵌套 ul，不影响 ul 的圆点/方块样式

真实可用的嵌套写法示例

下面这段是经过验证可直接运行的结构，适用于「操作步骤 + 可选子项」场景：

<ol>
<li>下载安装包
    <ul>
<li>Windows 版（.exe）</li>
      <li>macOS 版（.dmg）</li>
      <li>Linux 版（.tar.gz）</li>
    </ul>
</li>
  <li>运行安装向导</li>
  <li>配置初始设置
    <ul>
<li>选择语言</li>
      <li>登录账号（可选）</li>
    </ul>
</li>
</ol>

注意两点：