HTML Lists

HTML List

How to add ordered list in html?

There are three types of lists in HTML namely? unordered lists, ordered lists, and description lists. A description list has a different structure compared to its counterparts. Unordered and ordered lists are similar only that the in the former, data is presented randomly in a disorganized way.

HTML5 Elements

Unordered, ordered, and Description Lists

An unordered list is initiated using the <ul> tag, where each item is enclosed by the tags in the <li> element. Ordered lists are created in the same way as unordered lists although they are initiated using the <ol> tag. As stated earlier the structure of a description list is different ? they are initiated using the <dl> tag. For list items, use the <dt> tag to denote an item and the <dd> tag for its description. Below are examples that demonstrate how to create all three types of HTML lists.

How to add Unordered HTML List?

<ul>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

How to add Ordered HTML List?

<ol>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ol>

How to add Nested HTML Lists?

<ul>
  <li>Coffee</li>
  <li>Tea
    <ul>
      <li>Black tea</li>
      <li>Green tea</li>
    </ul>
  </li>
  <li>Milk</li>
</ul>

How to add Description Lists?

<dl>
  <dt>Coffee</dt>
  <dd>- black hot drink</dd>
  <dt>Milk</dt>
  <dd>- white cold drink</dd>
</dl>

HTML List Tags

Tag Description
<ul> Defines an unordered list
<ol> Defines an ordered list
<li> Defines a list item
<dl> Defines a description list
<dt> Defines a term in a description list
<dd> Describes the term in a description list
Join Telegram Join Whatsapp