The <dl> tag is used in HTML to define a list of definitions.
It allows you to associate terms with their definitions in a structured manner.
Structure and syntax of the <dl> tag
Basic structure and syntax
Here is the basic syntax of a <dl> tag:
<dl>
<dt>Term</dt>
<dd>Definition of the term</dd>
</dl>We find two other tags:
<dt>- For data title (title of the data), which allows you to enter the title of the term;<dd>- For data description (description of the data), which allows you to enter its description.
Usage example
Here is a typical example of using the <dl> tag:
<dl>
<dt>HTML</dt>
<dd>Hypertext Markup Language, the markup language for structuring web pages.</dd>
<dt>CSS</dt>
<dd>Cascading Style Sheets, used for styling HTML documents.</dd>
</dl>In this example, the <dl> tag is used to associate terms (via <dt>) with their definitions (via <dd>).
Attributes
The <dl> tag can accept some classic HTML attributes like class, id, or style, but it does not have specific attributes.
Best practices
It is recommended to use the <dl> tag to group terms with their definitions in contexts such as glossaries or indexes.
Avoid using this tag for ordered or unordered lists of simple items. The <dl> tag is exclusively used for definitions.
Difference with other similar tags
<ul>: The<ul>tag is used for unordered lists of general items, whereas<dl>is specifically for lists of terms and definitions.<ol>: The<ol>tag is used for ordered lists where the order of the items is important, unlike<dl>where the order does not have specific significance.
Browser compatibility
The <dl> tag is supported by all modern browsers.
| Browser | Compatibility |
|---|---|
| Chrome | Yes |
| Firefox | Yes |
| Safari | Yes |
| Edge | Yes |
| Internet Explorer | Yes |