<dl>

L'element HTML <dl>  (o Element HTML llista de descripcions) tanca una llista de parells de termes i descripcions. Els usos més comuns per a aquest element són per implementa un glossari o per mostrar metadades (una llista de parells clau-valor).

Abans d'HTML5, <dl> es coneixia com una llista de definicions.

Atributs

Aquest element inclou els atributs globals.

compact

Obliga a la descripció que aparegui en la mateixa línia que el terme. Aquest atribut no s'admet

Exemples

Terme únic i descripció

<dl>
  <dt>Firefox</dt>
  <dd>A free, open source, cross-platform, graphical web browser
      developed by the Mozilla Corporation and hundreds of volunteers.</dd>

  <!-- other terms and definitions -->
</dl>

Sortida:

Múltiples termes, descripció única

<dl>
  <dt>Firefox</dt>
  <dt>Mozilla Firefox</dt>
  <dt>Fx</dt>
  <dd>A free, open source, cross-platform, graphical web browser
      developed by the Mozilla Corporation and hundreds of volunteers.</dd>

  <!-- other terms and definitions -->
</dl>

Sortida:

Terme únic, múltiples descripcions

<dl>
  <dt>Firefox</dt>
  <dd>A free, open source, cross-platform, graphical web browser
      developed by the Mozilla Corporation and hundreds of volunteers.</dd>
  <dd>The Red Panda also known as the Lesser Panda, Wah, Bear Cat or Firefox,
      is a mostly herbivorous mammal, slightly larger than a domestic cat
      (60 cm long).</dd>

  <!-- other terms and definitions -->
</dl>

Sortida:

Múltiples termes i descripcions

També és possible definir diversos termes amb las definicions múltiples corresponents, mitjançant la combinació dels exemples anteriors.

Metadata

La descripció de les llistes són útils per mostrar les metadades com una llista de parells de clau-valor.

<dl>
    <dt>Name</dt>    
    <dd>Godzilla</dd>
    <dt>Born</dt>
    <dd>1952</dd>
    <dt>Birthplace</dt>
    <dd>Japan</dd>
    <dt>Color</dt>
    <dd>Green</dd>
</dl>

Consell: Pot ser útil per definir un separador clau-valor en CSS3, com ara:

dt:after {
  content: ": ";
}

Notes

No utilitzeu aquest element (ni elements <ul>) per crear simplement sangrat en una pàgina. Encara que funciona, això és una mala pràctica i enfosqueix el significat de les llistes de definicions.

Per canviar el sangrat de la descripció d'un terme, utilitzeu la propietat CSS margin.

Especificacions

Navegadors compatibles

Veure

• L'element <dt>
• L'element <dd>