HTML 列表
在本教程中，您将学习如何在 HTML 中创建不同类型的列表。
使用 HTML 列表
HTML 列表用于以格式良好和语义化的方式呈现信息列表。 HTML 中有三种不同类型的列表，每一种都有特定的目的和含义。
- 无序列表 — 用于创建相关项目的列表，没有特定的顺序。
- 有序列表 — 用于按特定顺序创建相关项目的列表。
- 描述列表 — 用于创建术语列表及其说明。
注意：您可以在列表项中放置文本、图像、链接、换行符等。您还可以在列表项中放置整个列表以创建嵌套列表。
在以下部分中，我们将一一介绍所有三种类型的列表：
HTML 无序列表
使用 <ul> 元素创建的无序列表，每个列表项都以 <li> 元素开头。
无序列表中的列表项标有项目符号。 这是一个例子：
<ul>
<li>Chocolate Cake</li>
<li>Black Forest Cake</li>
<li>Pineapple Cake</li>
</ul>— 上述示例的输出将如下所示：
- 巧克力蛋糕
- 黑森林蛋糕
- 凤梨酥
您还可以使用 CSS list-style-type 属性更改无序列表中的项目符号类型。 以下样式规则将项目符号的类型从默认的 disc 更改为 square：
ul {
list-style-type: square;
}请查看 CSS 列表 上的教程，详细了解如何设置 HTML 列表的样式。
HTML 有序列表
使用 <ol> 元素创建的有序列表，每个列表项都以 <li> 元素开头。 当列表项的顺序很重要时，使用有序列表。
有序列表中的列表项用数字标记。 这是一个例子：
<ol>
<li>Fasten your seatbelt</li>
<li>Starts the car's engine</li>
<li>Look around and go</li>
</ol>— 上面示例的输出将如下所示：
- 系好安全带
- 启动汽车引擎
- 环顾四周
有序列表中的项目编号通常从 1 开始。但是，如果要更改它，可以使用 start 属性，如下例所示：
<ol start="10">
<li>Mix ingredients</li>
<li>Bake in oven for an hour</li>
<li>Allow to stand for ten minutes</li>
</ol>— 上面示例的输出将如下所示：
- 混合配料
- 烤箱烤一个小时
- 静置十分钟
与无序列表一样，您也可以使用 CSS list-style-type 属性来更改有序列表中的编号类型。 以下样式规则将标记类型更改为罗马数字。
ol {
list-style-type: upper-roman;
}提示：您还可以使用 type 属性来更改编号类型，例如 type="I"。 但是，您应该避免使用此属性，而是使用 CSS list-style-type 属性。
HTML 描述列表
描述列表是包含每个项目的描述或定义的项目列表。
描述列表是使用 <dl> 元素创建的。 <dl> 元素与指定术语的 <dt> 元素和指定术语定义的 <dd> 元素结合使用。
浏览器通常通过将术语和定义放在单独的行中来呈现定义列表，其中术语的定义略微缩进。 这是一个例子：
<dl>
<dt>面包</dt>
<dd>一种用面粉制成的烘焙食品。</dd>
<dt>咖啡</dt>
<dd>一种由烘焙咖啡豆制成的饮料。</dd>
</dl>
— 上面示例的输出将如下所示：
- 面包
- 一种用面粉制成的烘焙食品。
- 咖啡
- 一种由烘焙咖啡豆制成的饮料。