HTML リスト
HTML は順序付きリスト、順序なしリスト、定義リストをサポートしています:
HTML リスト
順序付きリスト
|
順序なしリスト
|
![]() |
オンライン実例 |
順序なしリスト
この例では、順序なしリストを示しています。
順序付きリスト
この例では、順序付きリストを示しています。
(その他の実例は、このページの下部にあります。)
HTML 順序なしリスト
順序なしリストは項目のリストであり、このリストの項目は太字のドット(一般的には小さな黒い円)でマークされます。
順序なしリストは <ul> タグを使用します
<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>
<li>Coffee</li>
<li>Milk</li>
</ul>
ブラウザでは次のように表示されます:
- Coffee
- Milk
HTML 順序付きリスト
同様に、順序付きリストも一連の項目であり、リスト項目は数字でマークされます。順序付きリストは <ol> タグで始まります。各リスト項目は <li> タグで始まります。
リスト項目は数字でマークされます。
<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>
<li>Coffee</li>
<li>Milk</li>
</ol>
ブラウザでは次のように表示されます:
- Coffee
- Milk
HTML 定義リスト
定義リストは単なる一連の項目ではなく、項目とその説明の組み合わせです。
定義リストは <dl> タグで始まります。各定義リスト項目は <dt> で始まります。各定義リスト項目の定義は <dd> で始まります。
<dl>
<dt>Coffee</dt>
<dd>- black hot drink</dd>
<dt>Milk</dt>
<dd>- white cold drink</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
注意事項 - 役立つヒント
ヒント:リスト項目内では、段落、改行、画像、リンク、その他のリストなどを使用できます。
その他の実例
異なるタイプの順序付きリスト
この例では、異なるタイプの順序付きリストを示しています。
異なるタイプの順序なしリスト
この例では、異なるタイプの順序なしリストを示しています。
ネストされたリスト
この例では、リストをネストする方法を示しています。
ネストされたリスト 2
この例では、より複雑なネストされたリストを示しています。
定義リスト
この例では、定義リストを示しています。
HTML リストタグ
| タグ | 説明 |
|---|---|
| <ol> | 順序付きリストを定義する |
| <ul> | 順序なしリストを定義する |
| <li> | リスト項目を定義する |
| <dl> | 定義リストを定義する |
| <dt> | 定義リスト項目 |
| <dd> | 定義リスト項目の説明を定義する |
