LaunchCV.in
Learn HTML from Scratch

HTML Lists

Lesson 5 of 9 2 min read Updated 28 September 2026

HTML course
  1. What is HTML? Your First Web Page
  2. HTML Document Structure
  3. Headings, Paragraphs and Text Formatting
  4. Links and Images
  5. HTML Lists
  6. HTML Tables
  7. HTML Forms and Input Elements
  8. Semantic HTML and Accessibility
  9. Project: Build a Personal Profile Page
On this page
  1. Unordered lists
  2. Ordered lists
  3. Nested lists
  4. Description lists
  5. Lists for navigation
  6. Practice

Unordered lists

Use <ul> for items where order does not matter. Each item is an <li>.

<ul>
  <li>HTML</li>
  <li>CSS</li>
  <li>JavaScript</li>
</ul>

Ordered lists

Use <ol> when order matters, such as steps.

<ol>
  <li>Open your editor</li>
  <li>Write the code</li>
  <li>Save and test</li>
</ol>

You can change numbering with attributes: <ol type="A"> or <ol start="5">.

Nested lists

Place a list inside an <li>.

<ul>
  <li>Frontend
    <ul>
      <li>HTML</li>
      <li>CSS</li>
    </ul>
  </li>
  <li>Backend</li>
</ul>

Description lists

Use <dl> for terms and their meanings.

<dl>
  <dt>HTML</dt>
  <dd>Defines the structure of a page.</dd>
  <dt>CSS</dt>
  <dd>Defines the style of a page.</dd>
</dl>

Lists for navigation

Menus on most websites are unordered lists of links styled with CSS. This is good for accessibility because screen readers announce the number of items.

Practice

Write an ordered list of steps to make tea, with a nested unordered list for the ingredients.

By LaunchCV.in Editorial TeamLast reviewed 28 September 2026Editorial policyReport an error

Powered by