HTMLのリストとは

HTMLでは、情報をリストとして整理して表示するために、いくつかの異なるタイプのリストを使用することができます。これには順序なしリスト、順序付きリスト、定義リストがあります。

順序なしリスト (Unordered List)

順序なしリストは、項目の順序が重要でないリストに使用されます。HTMLでは <ul> タグで順序なしリストを作成し、各項目は <li> タグ（List Itemの略）でマークアップします。

<ul>
  <li>リスト項目1</li>
  <li>リスト項目2</li>
  <li>リスト項目3</li>
</ul>

ブラウザはデフォルトで順序なしリストの各項目の前に点を置いて表示しますが、CSSを使用してリストのスタイル（例えば、円や四角など）を変更することができます。

順序付きリストは、項目の順序が重要なリストに使用されます。HTMLでは <ol> タグで順序付きリストを作成し、各項目は <li> タグでマークアップします。

<ol>
  <li>最初の手順</li>
  <li>次の手順</li>
  <li>最後の手順</li>
</ol>

ブラウザはデフォルトで順序ありリストの各項目の前に数字を置いて表示します。CSSを使用すると、リストのマーカーの種類をローマ数字やアルファベットに変更することができます。

定義リストは、用語とその定義や説明を関連付ける場合に使用されます。HTMLでは <dl> タグで定義リストを作成し、<dt>（Definition Termの略）で用語を、<dd>（Definition Descriptionの略）でその定義をマークアップします。

<dl>
  <dt>HTML</dt>
  <dd>ハイパーテキストマークアップ言語の略。</dd>
  <dt>CSS</dt>
  <dd>カスケーディングスタイルシートの略。</dd>
</dl>

ブラウザは通常、<dt> を太字で表示し、<dd> の前には少しインデントを入れて表示します。

リストは他のリストの中に入れ子（ネスト）にすることができます。例えば、順序なしリストの中に別の順序なしリストを置くことで、サブリストを作成することが可能です。

<ul>
  <li>項目1</li>
  <li>項目2
    <ul>
      <li>サブ項目1</li>
      <li>サブ項目2</li>
    </ul>
  </li>
  <li>項目3</li>
</ul>

リストはウェブページのコンテンツを整理し、ユーザーが情報を理解しやすいようにするための重要なHTML要素です。CSSを用いて、リストの見た目をカスタマイズすることが一般的に行われます。

各リストの詳細はこちらをご覧ください。