List tags in HTML

To specify lists of information, an HTML List is used, which can be any of the three different types.

Ordered List or Numbered List (ol)
Unordered List or Bulleted List (ul)
Description List or Definition List (dl)

HTML Ordered List or Numbered List:

As the name itself suggests, all the list items are marked with numbers by default in a Numbered List. It is popularly known as HTML Ordered List and hence starts with the <ol> tag. The list items in an HTML Ordered List start with the <li> tag.

Example:

<!DOCTYPE html>
<html>
<body>
<h2>HTML Ordered List or Numbered List</h2>
<ol>
  <li>Name</li>
  <li>Age</li>
  <li>Address</li>
</ol>  
</body>
</html>

Explanation:

In the above example, we created an ordered or numbered list in HTML containing three items.

HTML Unordered List or Bulleted List:

As the name itself suggests, all the list items are marked with bullets by default in a Bulleted List. It is popularly known as HTML Unordered List and hence starts with the <ul> tag. The list items in an HTML Unordered List start with the <li> tag.

Example:

<!DOCTYPE html>
<html>
<body>
<h2>HTML Unordered List or Bulleted List</h2>
<ul>
  <li>Name</li>
  <li>Age</li>
  <li>Address</li>
</ul>  
</body>
</html>

Explanation:

In the above example, we created an unordered or bulleted list in HTML containing three items.

HTML Description List or Definition List:

In the HTML Description list, entries are listed like a dictionary or encyclopedia, and hence it is also called a Definition List. To display a glossary, a list of terms, or other name-value lists, the HTML Description list can be the best choice.

Example:

<!DOCTYPE html>
<html>
<body>
<h2>HTML Description List or Definition List</h2>
<dl>
  <dt><b>Name</b></dt>
  <dd>- Write your Full name in Capital letters.</dd>
  <dt><b>Age</b></dt>
  <dd>- Write your actual age.</dd>
  <dt><b>Address</b></dt>
  <dd>- Write your permanent address details.</dd>
</dl>
</body>
</html>

Explanation:

In the above example, we created a description or definition list in HTML containing three items along with their definitions.

HTML Nested List:

A nested list can be simply understood as a list within another list. The lists within a nested list need not be of the same type.

Example:

<!DOCTYPE html>
<html>
<body>
<h2>HTML Nested List</h2>
<ul>
  <li>Name</li>
  <li>Age</li>
  <li>Address
  <ol>
      <li>Local Address</li>
      <li>Permanent Address</li>
    </ol>
    </li>
</ul>
</body>
</html>

Explanation:

In the above example, we created a nested list in HTML. It includes an unordered list of three items. One of the items on this list contains an ordered list of two items.

Alex Martin