¿Qué es una lista?
Una lista es una etiqueta en HTML que nos ayuda a crear conjuntos de elementos en forma de lista dentro de una página web. Existen diferentes tipos de listas, entre ellas tenemos:
- Listas ordenadas
Estas listas nos permiten mostrar el contenido en un orden establecido, agregando un elemento de número a la lista. Por lo que, cada uno de los elementos irá precedido por un número que indicará su orden. Las etiquetas que definen las listas ordenadas son las siguientes:
<ol> ... </ol>
Un ejemplo podemos verlo a continuación:
<ol>
<li>Elemento 1</li>
<li>Elemento 2</li>
<li>Elemento 3</li>
</ol>
- Listas desordenadas
Este tipo de listas nos permiten mostrar contenido pero ya no de una forma ordenada, si no, simplemente precedidos por una viñeta, la cual puede ser un punto, un cuadro, un icono e inclusive una imagen que desees agrega. Las etiquetas que definen las listas desordenadas son las siguientes:
<ul> ... </ul>
Un ejemplo podemos verlo a continuación:
<ul>
<li>Elemento 1</li>
<li>Elemento 2</li>
<li>Elemento 3</li>
</ul>
- Listas de definiciones
Este tipo de listas nos permiten mostrar contenido que posee la estructura valor y definición. Estas listas son usualmente usadas para definir términos, tal como lo hace un diccionario. Las etiquetas que definen las listas desordenadas son las siguientes:
<dl> ... </dl>
Un ejemplo podemos verlo a continuación:
<dl>
<dt>Término 1</dt>
<dd>Definición 1</dd>
<dt>Término 2</dt>
<dd>Definición 2</dd>
</dl>
- Listas anidadas
Este tipo de listas son una combinación de todas las demás en una sola, es decir, que podemos combinar los diferentes tipos de listas anidandolos para mostrar sublistas, lo que al final quedaría asi
<ol>
<li>Elemento 1</li>
<li>Elemento 2
<ul>
<li>Elemento 2.1</li>
<li>Elemento 2.2</li>
<li>Elemento 2.3</li>
</ul>
<li>Elemento 3</li>
</ol>