ネストされたリスト

あるリストを別のリストの中に配置できます。これは入れ子になったリストと呼ばれます。アウトラインや複数レベルのメニューなど、階層構造を作成するのに便利です。 

ネストされたリストを作成するには、別のリストの<li>要素の中に<ul>または<ol>要素を配置するだけです。

ネストされた順序なしリストの例を次に示します。

<ul>
  <li>Item 1</li>
  <li>Item 2
    <ul>
      <li>Subitem 2.1</li>
      <li>Subitem 2.2</li>
    </ul>
  </li>
  <li>Item 3</li>
</ul>

2 番目の項目には 2 つのサブ項目を含む入れ子になったリストがあります。ブラウザーでは、次のように表示されます：

• Item 1
• Item 2
  • Subitem 2.1
  • Subitem 2.2
• Item 3

順序付きリストを入れ子にしたり、両方を組み合わせたりすることもできます。