HTML 列表

HTML 列表用於將相關資訊分組在一起。

瞭解 HTML 列表

HTML 列表用於以良好形式和語義的方式呈現資訊列表。HTML 中有三種不同型別的列表，每種列表都有特定的用途和含義：

• 無序列表 - 用於按一般順序對一組相關項進行分組。
• 有序列表 - 用於按特定順序對一組相關項進行分組。
• 描述列表 - 用於顯示術語列表及其描述。

注意： 在列表項中，你可以放置​文字、換行符、影象、連結等。你還可以將整個列表放在列表項中以建立巢狀列表。

在本教程中，我們將逐一介紹所有這些不同的列表型別：

HTML 無序列表

使用 <ul> 標記建立的無序列表，每個列表項都以 <li> 標記開頭。

預設情況下，無序列表中的列表項標有專案符號（小黑圈）。

<ul>
    <li>Chocolate Cake</li>
    <li>Black Forest Cake</li>
    <li>Pineapple Cake</li>
</ul>

- 上面示例的輸出將如下所示：

• Chocolate Cake
• Black Forest Cake
• Pineapple Cake

HTML 有序列表

使用 <ol> 標記建立的有序列表以及每個列表項都以 <li> 標記開頭。有序列表包含應強調順序的資訊。

有序列表中的列表項標有數字。

<ol>
    <li>Mix ingredients</li>
    <li>Bake in oven for an hour</li>
    <li>Allow to stand for ten minutes</li>
</ol>

- 上面示例的輸出將如下所示：

1. Mix ingredients
2. Bake in oven for an hour
3. Allow to stand for ten minutes

HTML 定義列表

定義列表是專案列表，包含每個專案的描述。

使用 <dl> 標記建立的定義列表。該 <dl> 標籤用於會同 <dt> -定義列表中的專案，<dd> 介紹了在列表中的專案：

<dl>
    <dt>Bread</dt>
    <dd>A baked food made of flour.</dd>
    <dt>Coffee</dt>
    <dd>A drink made from roasted coffee beans.</dd>
</dl>

- 上面示例的輸出將如下所示：

• Bread

  A baked food made of flour.

• Coffee

  A drink made from roasted coffee beans.