HTML 列表的类型

1. 前言

HTML 是一种用于创建网页的标记语言，不同类型的标记在网页中具有不同的作用。本文将会介绍 HTML 中的列表类型，它们的特点和用法。

2. 无序列表

无序列表是一种用于表示没有特定顺序的项目的列表类型。在无序列表中，每个项目都以一个圆点或其他符号串联在一起，以示与其他列表项的分界。

2.1 语法

<ul>
    <li>列表项1</li>
    <li>列表项2</li>
    <li>列表项3</li>
</ul>

上述代码中，<ul> 表示列表的开始，</ul> 表示列表的结束。每个列表项都包含在 <li> 和 </li> 标签之间。

2.2 示例

列表项1

列表项2

列表项3

3. 有序列表

有序列表是一种用于表示有特定顺序的项目的列表类型。在有序列表中，每个项目都有一个数字或字母等序号，并且按照指定的顺序排列。

3.1 语法

<ol>
    <li>列表项1</li>
    <li>列表项2</li>
    <li>列表项3</li>
</ol>

上述代码中，<ol> 表示列表的开始，</ol> 表示列表的结束。每个列表项都包含在 <li> 和 </li> 标签之间。

3.2 示例

列表项1

列表项2

列表项3

4. 自定义列表

自定义列表是一种用于表示项目之间没有特定顺序的列表类型。在自定义列表中，每个项目前都有一个定义，并且这些定义通常以一些特殊符号开始。自定义列表常用于表示术语、定义和缩略语。

4.1 语法

<dl>
    <dt>项目1</dt>
    <dd>定义1</dd>
    <dt>项目2</dt>
    <dd>定义2</dd>
</dl>

上述代码中，<dl> 表示列表的开始，</dl> 表示列表的结束。每个项目的定义包含在 <dt> 和 </dt> 标签之间，每个定义包含在 <dd> 和 </dd> 标签之间。

4.2 示例

HTML

超文本标记语言

CSS

层叠样式表

JS

JavaScript

5. 带有嵌套列表的列表

列表可以嵌套在其他列表中，形成带有嵌套列表的列表。

5.1 语法

<ul>
    <li>列表项1</li>
    <li>列表项2
        <ol> 
            <li>嵌套列表项1</li>
            <li>嵌套列表项2</li>
        </ol>
    </li>
</ul>

上述代码中，嵌套在 <li> 和 </li> 标签之间的是另一个列表。

5.2 示例

列表项1

列表项2

嵌套列表项1

嵌套列表项2

6. 小结

本文介绍了 HTML 中的列表类型，包括无序列表、有序列表、自定义列表和带有嵌套列表的列表。通过这些列表类型，我们可以更好地组织和呈现网页的内容。在实际使用中，应当根据具体需要选择不同的列表类型。