HTML リスト


HTML は順序付きリスト、順序なしリスト、定義リストをサポートしています:

HTML リスト

順序付きリスト

  1. 最初のリスト項目
  2. 2番目のリスト項目
  3. 3番目のリスト項目

順序なしリスト

  • リスト項目
  • リスト項目
  • リスト項目

实例

オンライン実例

順序なしリスト
この例では、順序なしリストを示しています。

順序付きリスト
この例では、順序付きリストを示しています。

(その他の実例は、このページの下部にあります。)


HTML 順序なしリスト

順序なしリストは項目のリストであり、このリストの項目は太字のドット(一般的には小さな黒い円)でマークされます。

順序なしリストは <ul> タグを使用します

<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>

ブラウザでは次のように表示されます:

  • Coffee
  • Milk

HTML 順序付きリスト

同様に、順序付きリストも一連の項目であり、リスト項目は数字でマークされます。順序付きリストは <ol> タグで始まります。各リスト項目は <li> タグで始まります。

リスト項目は数字でマークされます。

<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>

ブラウザでは次のように表示されます:

  1. Coffee
  2. Milk

HTML 定義リスト

定義リストは単なる一連の項目ではなく、項目とその説明の組み合わせです。

定義リストは <dl> タグで始まります。各定義リスト項目は <dt> で始まります。各定義リスト項目の定義は <dd> で始まります。

<dl>
<dt>Coffee</dt>
<dd>- black hot drink</dd>
<dt>Milk</dt>
<dd>- white cold drink</dd>
</dl>

ブラウザでは次のように表示されます:

Coffee
- black hot drink
Milk
- white cold drink

注意事項 - 役立つヒント

ヒント:リスト項目内では、段落、改行、画像、リンク、その他のリストなどを使用できます。


Examples

その他の実例

異なるタイプの順序付きリスト
この例では、異なるタイプの順序付きリストを示しています。

異なるタイプの順序なしリスト
この例では、異なるタイプの順序なしリストを示しています。

ネストされたリスト
この例では、リストをネストする方法を示しています。

ネストされたリスト 2
この例では、より複雑なネストされたリストを示しています。

定義リスト
この例では、定義リストを示しています。


HTML リストタグ

タグ 説明
<ol> 順序付きリストを定義する
<ul> 順序なしリストを定義する
<li> リスト項目を定義する
<dl> 定義リストを定義する
<dt> 定義リスト項目
<dd> 定義リスト項目の説明を定義する
その他の拡張