ulタグで入れ子にする正しい方法

ul要素(ol要素)で許可されている内容はli要素だけです。つまりulタグの直下にはliタグしか入れられません。
したがって次のようにすることはできません。

<ul>
  <li>list</li>
  <li>list</li>
  <ul>
    <li>list</li>
    <li>list</li>
  </ul>
</ul>

上の例はulタグの直下にulタグがあるのがダメです。

入れ子(階層構造)にする場合は次のようにします。

<ul>
  <li>list</li>
  <li>list
    <ul>
      <li>list</li>
      <li>list</li>
    </ul>
  </li>
</ul>
  • list
  • list
    • list
    • list

また次のように書くことも許されますが期待通りになりません。

<ul>
  <li>list</li>
  <li>
    <ul>
      <li>list</li>
      <li>list</li>
    </ul>
  </li>
</ul>
  • list
    • list
    • list

コメント

タイトルとURLをコピーしました