Skip to content

H040 Lists

Here you can practice working with lists.

  • Create an index.html with a standard template (!+tab).
  • Add an h1 with the text “Lists.”
  • Add an unordered list (ul) with 5 items with the text (Item 1, Item 2, etc.).
  • Add an ordered list (ol) with 5 items with the text (Item 1, Item 2, etc.).
  • Add an unordered list (ul) with 3 items with the text (Item 1, Item 2, etc.), but Item 2 should have an unordered sublist with two items (Item a, Item b).

It should look like this:

REMEMBER – the page must validate against W3C. Use Live Server to preview the result.

See a possible solution 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Lists</title>
</head>

<body>
    <h1>Lists</h1>

    <ul>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
    <li>Item 5</li>
    </ul>

    <ol>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
    <li>Item 5</li>
    </ol>

    <ul>
    <li>Item 1</li>
    <li>
        Item 2
        <ul>
        <li>Item a</li>
        <li>Item b</li>
        </ul>
    </li>
    <li>Item 3</li>
    </ul>
</body>
</html>