Listy zagnieżdżone

Możesz umieścić jedną listę wewnątrz drugiej. Nazywa się to listą zagnieżdżoną. Jest to przydatne do tworzenia struktur hierarchicznych, takich jak konspekty lub wielopoziomowe menu. 

Aby utworzyć listę zagnieżdżoną, wystarczy umieścić element <ul> lub <ol> wewnątrz elementu <li> innej listy.

Oto przykład zagnieżdżonej listy nieuporządkowanej:

<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>

Drugi element zawiera zagnieżdżoną listę z dwoma podpunktami. W przeglądarce będzie wyświetlana w ten sposób:

• Element 1
• Element 2
  • Podpunkt 2.1
  • Podpunkt 2.2
• Element 3

Możesz też zagnieżdżać listy uporządkowane lub łączyć oba rodzaje.