HTML List Tutorial

In HTML

HTML lists are used to organize and display related information in a structured way. There are two types of lists in HTML: ordered lists and unordered lists.

Ordered lists

An ordered list is a list of items that are numbered in a specific order. To create an ordered list in HTML, you can use the <ol> element, which stands for "ordered list." Each item in the list is represented by a <li> element, which stands for "list item." Here is an example of an ordered list:

<ol>
  <li>First item</li>
  <li>Second item</li>
  <li>Third item</li>
</ol>


This will be displayed as:

  1. First item

  2. Second item

  3. Third item

Unordered lists

An unordered list is a list of items that are not numbered in a specific order. To create an unordered list in HTML, you can use the <ul> element, which stands for "unordered list." Each item in the list is again represented by a <li> element. Here is an example of an unordered list:

<ul>
  <li>First item</li>
  <li>Second item</li>
  <li>Third item</li>
</ul>


This will be displayed as:

  • First item

  • Second item

  • Third item


Nested lists

You can also nest lists within each other to create more complex structures. For example, you might create an ordered list of items, with each item being an unordered list of sub-items.

<ol>
  <li>First item
    <ul>
      <li>First sub-item</li>
      <li>Second sub-item</li>
    </ul>
  </li>
  <li>Second item
    <ul>
      <li>First sub-item</li>
      <li>Second sub-item</li>
    </ul>
  </li>
</ol>


This will be displayed as:

  1. First item

  • First sub-item

  • Second sub-item

  1. Second item

  • First sub-item

  • Second sub-item


I hope this tutorial has been helpful in understanding how to use lists in HTML. If you have any further questions, please don't hesitate to ask.

You May Also Like