HTML Lists

Create an unordered list containing five web development skills. Add a heading above it.

Exercise 2: Step-by-Step Instructions

Create an ordered list describing how to create and open an HTML file. Use the correct semantic structure.

Exercise 3: Custom Numbering

Create an ordered list that starts at 5. Create another ordered list using uppercase letters. Then experiment with reversed numbering.

Exercise 4: Nested Learning Roadmap

Create a nested list containing Frontend Development and Backend Development. Add relevant technologies beneath each category.

Exercise 5: Product Specifications

Use a description list to display the name, processor, memory and storage of a sample laptop.

Exercise 6: Course Navigation

Create a nested list for a course navigation menu with three modules and three lessons in each module.

Exercise 7: Debug the Markup

Find and correct the mistakes in this example:

<ul>
    <li>HTML
    <li>CSS</li>
    <ol>
        <li>Selectors</li>
    </ol>
</ul>

Ensure that the list has valid nesting and that the HTML source is easy to read and maintain.

16. Section 9 Quiz: Test Your Understanding

Answer all 10 questions before reviewing the answer key. The quiz covers list types, attributes, nesting, semantics, accessibility and CSS presentation.

Question 1: Unordered Lists

Which element creates an unordered list?

1. <ol>
2. <ul>
3. <dl>
4. <li>

Question 2: Ordered Lists

Which list type is most appropriate for instructions that must be followed in sequence?

1. Description list
2. Unordered list
3. Ordered list
4. Definition container using div elements only

Question 3: Description Lists