typestar

Nested lists in HTML

A sub-list goes inside the item it belongs to, not beside it.

<ul>
  <li>Fruit
    <ul>
      <li>Apples</li>
      <li>Pears</li>
    </ul>
  </li>
  <li>Vegetables
    <ul>
      <li>Leeks</li>
    </ul>
  </li>
</ul>

How it works

  1. The nested <ul> is a child of the <li>, before its closing tag.
  2. A list's only allowed children are <li> and script-supporting tags.
  3. Indentation is for you; the nesting is what the browser reads.

The run, in numbers

Lines
13
Characters to type
115
Tokens
61
Three-star pace
65 tpm

At the three-star pace of 65 tokens a minute, this run takes about 56 seconds.

Type this snippet

Step 3 of 5 in Lists, step 13 of 28 in Document structure.

← Previous Next →