Una lista definida

Hoy hablaremos de las lista de definición y se aprenderá a anidar listas para hacer estructuras lista más difíciles.

Se terminan los temas con relación a las listas de PaginasWebs.com con las listas de definición. Se verá además la anidación de listas, que trascenderá a un recurso sugestivo para estructurar datos un poco más complejos o contar elementos con una jerarquía.

Listas de definición

Las listas de definición se usan para lograr un conjunto de elementos con pares concepto-descripción. O sea, se detallarán distintos términos por su nombre y se redactará una definición para cada una. Cada elemento es mostrado junto con su concepto, uno detrás de otro.

Para hacer una lista de definición, la etiqueta primordial es <dl> y </dl> (definition list). La etiquetas del elemento y su conceptuación son <dt> (definition term) y <dd> (definition definition) proporcionalmente.

Es por eso que acá les dejamos un código que podrá aclarar este sistema:

<p>Catálogo de belleza</p>
<dl>
<dt>Perfumes
<dd>Rocío de jazmín
<dt>Todo en ropa
<dd>Ropa de gala
</dl>

El efecto producido:

Catálogo de Belleza

Perfumes

Rocío de jazmín

Todo en ropa

Ropa de gala

Si se fijan en que cada línea <dd> esta desplazada hacia la izquierda. Este tipo de etiquetas son empleadas usualmente con la intención de crear textos más o menos desplazados hacia la izquierda.

El código:

<dl>
<dd>Primer nivel de desplazamiento
<dl>
<dd>Segundo nivel de desplazamiento
<dl>
<dd>Tercer nivel de desplazamiento
</dl>
</dl>
</dl>

El resultado:

Primer nivel de desplazamiento

Segundo nivel de desplazamiento

Tercer nivel de desplazamiento

Anidando listas

Ahora bien, nada os impedirá manejar todas estas etiquetas de manera anidada como se ha visto en otros casos. De esta manera, se pueden lograr listas mixtas como por ejemplo:

<p>Países del mundo</p>
<ul>
<li>Venezuela
<ol>
<li>Zulia
<li>Maracaibo
</ol>
<li>México
<ol>
<li>México DF
<li>Monterrey
</ol>
</ul>

De esta manera se hace una lista como esta:

Ciudades del mundo

• Venezuela
  1. Zulia
  2. Maracaibo
• México
  1. México DF
  2. Monterrey