HTML列表教程

在上面的示例中，我创建了一个 HTML 列表并将我们的水果添加到其中。

列表是使用<ul>标签指定的，每个列表项都使用<li>标签嵌套在里面。

该<ul>元素表示一个无序列表。这是因为这些项目没有按特定顺序列出。这会导致列表中每个项目的前缀相同。

如果我们想以特定顺序列出项目，我们将使用有序列表。为此，我们只需将<ul>标签交换为<ol>标签，使其看起来像这样：

<ol>
        <li>Bananas</li>
        <li>Oranges</li>
</ol>

列表项标签（即<li>）将保持不变（尽管我们需要确保它们以正确的顺序列出）。

HTML 列表还可以帮助浏览器理解它也是一个列表。这样它就可以以特定的方式呈现列表（例如，使用项目符号或数字等）。但是，您可以使用级联样式表 (CSS) 更改此设置。事实上，您可以使用 CSS 更改任何 HTML 元素的样式。我们将在本教程后面讨论 CSS。

列表类型
HTML 包含用于不同类型列表的各种标签。这是一个解释。

<ul>
该<ul>元素表示一个无序列表。无序列表是列表项没有按特定顺序列出的列表。因此，可以在没有数字或其他排序机制的情况下列出每个列表项。无序列表通常会在每个项目旁边显示圆形或方形项目符号（与数字或字母等相反）。图像还可用于创建您自己的自定义项目符号。
像这样：

<ul>
        <li>Bananas</li>
        <li>Oranges</li>
</ul>

<ol>
此元素表示一个有序列表。有序列表是一个列表，其中项目已被有意排序。有序列表的要点是需要对列表项进行排序才能传达预期的含义。更改顺序将更改列表（或文档）的含义。例如，如果我们想按优先顺序显示水果，我们需要使用有序列表。这使我们能够按照偏好的确切顺序列出水果。通过改变顺序会改变意义。另一个例子是，如果我们的水果是食谱中的成分列表，并且它们必须以正确的顺序添加。
有序列表可以使用十进制数（例如，1.2.3....等）、小写拉丁字母表（例如，abc...等）、大写拉丁字母表（例如，ABC...等）进行排序)、小写罗马数字（例如 i. ii. iii. ... 等）或大写罗马数字（例如 I. II. III. ... 等）。您可以指定列表是升序（例如，1.2.3....等）还是降序（3.2.1....等）。

<ol>
        <li>Bananas</li>
        <li>Oranges</li>
</ol>

<dl>
表示定义列表。在定义列表中，每个列表项包含两个或多个条目；一个术语和至少一个描述。术语由<dt>元素表示，描述由<dd>元素表示。定义列表的一个示例是您现在正在阅读的列表。我在此处列出的三种类型的列表显示在定义列表中。
定义列表是这样写的：

<dl>
        <dt>Bananas</dt>
        <dd>A sweet yellow fruit...</dd>
        <dt>Oranges</dt>
        <dd>A sweet orange fruit...</dd>
</dl>
HTML 还包括其他列表方法，例如在表单的下拉菜单中提供项目列表，但我们稍后会讨论。