HTML 列表¶

列表把相关项目组织成可扫描的结构。无序列表、顺序列表和描述列表分别表达不同关系，不应仅根据默认项目符号外观选择。

学习目标¶

项目顺序决定列表类型，无序列表用于顺序无关的项目，有序列表用于步骤或排名，描述列表则表达名称与说明。

项目顺序不影响含义时使用 ul：

<ul>
  <li>代码编辑器</li>
  <li>现代浏览器</li>
  <li>HTML 验证工具</li>
</ul>

ul 的直接子元素应为 li。若列表项需要段落、链接或子列表，应把它们放进对应 li 中。

步骤或排名依赖顺序时使用 ol：

<ol>
  <li>创建 HTML 文件。</li>
  <li>写入完整文档骨架。</li>
  <li>在浏览器中打开并验证。</li>
</ol>

浏览器会自动生成序号，删除或插入项目后无需手工改写正文编号。start、reversed 和 value 可表达确有需要的编号变化，但不应用它们修饰纯视觉效果。

名称与一个或多个描述构成关联时使用 dl：

<dl>
  <dt>HTML</dt>
  <dd>描述网页内容结构与语义的标记语言。</dd>
  <dt>CSS</dt>
  <dd>描述网页视觉表现的样式表语言。</dd>
</dl>

描述列表适合术语、元数据或名称和值，不应为了没有项目符号的缩进效果而滥用。

子列表必须位于所属的 li 内。导航链接常可组织成列表，但 nav 表达导航地标，列表表达项目关系，二者职责不同，可根据内容组合使用。CSS 可以改变标记样式，不会改变列表语义。

外部数据生成列表时，应把数据作为文本安全输出。不要让不可信 HTML 直接成为列表项，也不要通过隐藏列表项实现访问控制；服务端仍需检查权限。