Description List in HTML

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.

There are three tags used in an HTML Description list. These are:

  • <dl>: To define the description list.
  • <dt>: To define the data term.
  • <dd>: To define the data definition or description.

Example:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<!DOCTYPE html>
<html>
<body>
<h2>HTML Description List or Definition List</h2>
<dl>
<dt><b>HTML</b></dt>
<dd>- Hyper Text Markup Language</dd>
<dt><b>HTTP</b></dt>
<dd>- Hyper Text Transfer Protocol</dd>
</dl>
</body>
</html>
<!DOCTYPE html> <html> <body> <h2>HTML Description List or Definition List</h2> <dl> <dt><b>HTML</b></dt> <dd>- Hyper Text Markup Language</dd> <dt><b>HTTP</b></dt> <dd>- Hyper Text Transfer Protocol</dd> </dl> </body> </html>
<!DOCTYPE html>
<html>
<body>
<h2>HTML Description List or Definition List</h2>
<dl>
  <dt><b>HTML</b></dt>
  <dd>- Hyper Text Markup Language</dd>
  <dt><b>HTTP</b></dt>
  <dd>- Hyper Text Transfer Protocol</dd>
</dl>
</body>
</html>

Explanation:

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