Web Design Garage

Nesting Lists in HTML

Nested lists are lists that appear inside other lists. In HTML markup, a nested list takes the place of a list item, like so:

<ol>
  <li>First item of the main list</li>
  <li>Second item of the main list</li>
  <li>Third item of the main list</li>

<!-- Here comes the nested list -->

  <ol>
    <li>First item of the nested list</li>
    <li>Second item of the nested list</li>
    <li>Third item of the nested list</li>
  </ol>

<!-- There went the nested list -->

  <li>Fourth item of the main list</li>
  <li>Fifth item of the main list</li>
</ol>

You may nest list within lists within lists if you so choose:

 <ul> <li>First item of the main list</li> <li>Second item of the main list</li> <li>Third item of the main list</li> <!-- Here comes the nested ...