<dl>: The DL Element
Last updated: 2026-10-13
<dl>The DL Element
A description list (term–description pairs), used for glossaries or key-value metadata.
| Category | Lists |
|---|---|
| Content Model | Flow content |
| Allowed Parents | Any element that accepts flow content |
| Content Tag | Yes — requires closing </dl> tag |
| Status | Standard |
📝 Syntax
<dl>
<dt>Term</dt>
<dd>Description</dd>
</dl>▶ Example
Edit the code below and see the live result in the playground:
🌐 Browser Support
| Browser |  Chrome |
 Edge |
 Firefox |
 Safari |
 Opera |
|---|---|---|---|---|---|
| <dl> | ✓ v1 | ✓ v12 | ✓ v1 | ✓ v1 | ✓ v1 |
| Supported in all major browsers | |||||
Tip： dl's direct children should be dt (term) and dd (description), not ul/li.
❓ FAQ
QMust dl pair dt and dd?
AStructurally a
<dl> holds several 'dt + dd' groups: dt is the term, dd the description. One dt may be followed by multiple dds (a term with multiple meanings), and multiple dts may share one dd (synonyms); but neither dt nor dd may appear outside a dl.QIs dl only for glossaries?
ANot at all: metadata key-value pairs (e.g. 'Published: 2026-10-09'), FAQs (question as dt, answer as dd), and product spec sheets all fit. The criterion is a 'name-value' structure — any paired data can be semantically marked up with dl.
QCan dl contain div directly?
AYes — HTML5 allows
<div> inside <dl> to wrap each dt+dd group for styling or microdata. The div must wrap a complete group; you cannot split dt and dd into different divs.🏷️ Related Tags
💡 Related Cases
More case studies coming soon — check back later.
📚 Related Tutorials
