HTML <dl> Tag

The <dl> tag in HTML represents a description list, which is a way to group a set of terms and their corresponding descriptions. Unlike standard lists (<ul> for unordered lists or <ol> for ordered lists), a description list is specifically used to associate pairs of items, typically a term with a definition, explanation, or value.

Inside a <dl> element, you use <dt> (definition term) elements to represent the term or name, and <dd> (definition description) elements to represent the description or explanation of that term. A single term can have multiple descriptions, and multiple terms can share the same description if needed.

Description lists are often used in contexts such as:

• Glossaries of terms
• Metadata or key-value pairs
• FAQ sections
• Specifications or attribute lists

By default, browsers render <dt> elements in bold and <dd> elements with an indented layout, visually distinguishing terms from their descriptions. However, these styles can be customized easily using CSS to fit the design of your page.

Example usage:

<dl>
  <dt>HTML</dt>
  <dd>A markup language used for structuring content on the web.</dd>
  
  <dt>CSS</dt>
  <dd>A style sheet language used to describe the presentation of web pages.</dd>
  
  <dt>JavaScript</dt>
  <dd>A programming language used to create dynamic and interactive web content.</dd>
</dl>

In this example, each term (<dt>) is clearly paired with a description (<dd>), providing a semantically meaningful way to convey structured information.