HTML Definition List <dl>

The third type of HTML list we can use is a definition list.

In my years building and working on websites, I don’t think I’ve used this list once, however it is a good element to leverage if the use case is right.

While the unordered list and ordered list elements are used on many sites, the definition list is seldomly used.

The definition list is used when you want to list terms and their definitions.

While the structure for the definition list is the same as the other two, the tags are a little different.

The definition list does not use <li> to list items, instead it uses <dt> for the definition term and <dd> for the definition.

Here’s an example:



<p>Common Furniture Items</p>

<dl>
 <dt>Table</dt>
 <dd>Somewhere to sit at or to eat at</dd>
 <dt>Chair</dt>
 <dd>Used to sit at the table, at a desk or elsewhere</dd>
 <dt>Desk</dt>
 <dd>Used as a place to do personal or professional work</dd>
</dl>


Common Furniture Items

Table
Somewhere to sit at or to eat at
Chair
Used to sit at the table, at a desk or elsewhere
Desk
Used as a place to do personal or professional work

So the definition list, like the others, gives us a quick and easy way to create a neat and tidy list, this one to define terms.