A small glossary builds term and definition pairs using dl, dt, and dd elements.

Program

Use a definition list when each item is a term-description pair rather than a bullet or numbered sequence.

definition_list.html
Visuals: captured from real browser rendering
<dl>
  <dt>HTML</dt>
  <dd>Markup language for web documents.</dd>
  <dt>CSS</dt>
  <dd>Style language for those documents.</dd>
  <dt>DOM</dt>
  <dd>Tree built from parsed markup.</dd>
</dl>
  1. Create the glossary list.

    An empty glossary panel appears.
    The dl element groups term-description pairs.
  2. Add the HTML term and definition.

    The glossary shows HTML and its definition.
    A dt term is followed by its dd definition.
  3. Add the CSS term and definition.

    The glossary now shows HTML and CSS rows.
    A second term-description pair extends the glossary.
  4. Add the DOM term and definition.

    The glossary shows three term-definition rows.
    The final pair completes the compact glossary.
  5. Complete the glossary structure.

    The completed glossary remains visible with three rows.
    Closing the dl finalizes the list of paired meanings.
dt A dt element names a term in a definition list.
dd A dd element gives the corresponding description.