Tag dt

The <dt> tag is used to define the term or name in a description list, which is created using the <dl> element. It is paired with <dd>, which provides the description for that term.

✅ Basic Example

<dl>
  <dt>HTML</dt>
  <dd>HyperText Markup Language</dd>

  <dt>CSS</dt>
  <dd>Cascading Style Sheets</dd>
</dl>

📍 Result:

  • “HTML” and “CSS” are terms
  • Their definitions appear below or beside them, depending on styling

🧩 Tag Relationships

TagPurpose
<dl>Starts the description list
<dt>The term being defined
<dd>The description or explanation

You can have:

  • One <dd> per <dt>
  • Multiple <dd>s for one <dt>
<dl>
  <dt>JavaScript</dt>
  <dd>A scripting language for the web.</dd>
  <dd>Used to make pages interactive.</dd>
</dl>

🎨 Styling Tips

<style>
  dt {
    font-weight: bold;
    margin-top: 10px;
  }

  dd {
    margin-left: 20px;
    color: #555;
  }
</style>

This gives a clean look for glossaries or FAQs.

✅ Summary

Tag<dt>
PurposeDefines a term in a description list
Paired with<dd> (definition)
Used inside<dl> (description list)

🧠 When to Use

Use <dt> when:

  • You’re building a glossary
  • Creating an FAQ
  • Displaying key-value pairs (like metadata, profiles, or product specs)