The dd
tag stands for “description” or “definition details”. It is used inside a dl
(description list) and provides the description or value for a term defined with <dt>
(definition term).
✅ Basic Structure
<dl>
<dt>HTML</dt>
<dd>A markup language used to create web pages.</dd>
<dt>CSS</dt>
<dd>A language used to style the layout and appearance of web pages.</dd>
</dl>
📍 Result:
A neatly formatted list where terms (like HTML, CSS) are followed by their descriptions.
🧩 When to Use <dd>
- Glossaries
- Metadata lists
- FAQ pages (Q as
<dt>
, A as<dd>
) - Any paired information where each term needs an explanation
🧠 Tip: You Can Have Multiple <dd>
s per <dt>
<dl>
<dt>JavaScript</dt>
<dd>A programming language for the web.</dd>
<dd>Enables interactivity in HTML documents.</dd>
</dl>
This displays multiple lines under a single term.
🎨 Styling Example
<style>
dl {
font-family: Arial, sans-serif;
}
dt {
font-weight: bold;
margin-top: 10px;
}
dd {
margin-left: 20px;
color: #555;
}
</style>
This adds clean, readable formatting for your description list.
✅ Summary
Tag | <dd> |
---|---|
Purpose | Provides description/detail |
Used in | <dl> (description list) |
Follows | <dt> (definition term) |
Semantics | Improves accessibility and meaning |