La etiqueta HTML <dl>

Etiquetas HTML para crear listas de descripciones

html ᐳ La etiqueta HTML <pre> ᐳ La etiqueta HTML <dl> ᐳ La etiqueta HTML <figure>

De la misma forma que podemos crear listas genéricas con las etiquetas <ol> o <ul>, podemos crear listas de descripciones. La diferencia principal, es que este tipo de listas se suele utilizar cuando queremos asociar pares de nombre-valor, es decir, una lista de términos, donde cada término tiene una definición asociada.

Primero veamos las etiquetas que entran dentro de esta categoría:

Etiqueta	Descripción
`<dl>`	Define una lista de descripciones. Es la etiqueta contenedora.
`<dt>`	Término de la descripción. Contiene el nombre o término a describir.
`<dd>`	Descripción o valor asociado al término. Pueden existir varios por término.

Listas de descripción

Veamos un ejemplo práctico de como utilizar este tipo de listas:

<dl>
  <dt>Gallina</dt>
  <dd>Ave doméstica del orden de las galliformes.</dd>
  <dd>Cobarde, pusilánime.</dd>

  <dt>Gato</dt>
  <dd>Animal que en algún momento dominó Internet y en el futuro dominará el mundo.</dd>
</dl>

Observa que se trata de una lista de valores, pero no tiene porqué estar asociado a una sola definición. En el caso de la Gallina hay dos definiciones <dd> asociadas a la etiqueta del término <dt>. Sin embargo, en el segundo caso de la palabra Gato, hay sólo una definición.

Tabla de contenidos