Listas

Las listas en HTML sirven para listar contenido. En función del tipo de contenido de nuestra lista, tenemos 3 tipos de listas.

ul: Unordered List:; Utiliza cuando el orden de los elementos no influye, por ejemplo la lista d compras, da igual si el pan está antes que la leche o viceversa.
ol: Ordered List:; Este tipo de lista sí importa el orden, por ejemplo la lista de posiciones de los ganadores de un concurso.
dl: Definition List:; Utiliza para hacer una lista de definiciones, un diccionario por ejemplo.

Unordered List y Ordered List

Semánticamente son diferentes, y el navegador no interpreta lo mismo si pones una lista UL que una lista OL. Sin embargo, tienen en común el elemento hijo que es el elemento de lista, y se llama LI, representado en código HTML de la siguiente forma <li></li>. Son elementos de bloque, pueden contener, tanto texto plano como etiquetas de línea como otras etiquetas de bloque incluídas otros OL o UL.

Definition List

Para crear una lista de definición se usan las etiquetas <dl></dl> de apertura y cierre respectivamente, que significan definition list. Y dentro, para declarar el término a definir, se usa las etiquetas <dt></dt> que significan definition term, de igual forma para declarar la descripción de ese término se utilizan las etiquetas <dd></dd> que significa definition description.

Como curiosidad, por cada término solo debe ir una etiqueta dt, pero puede ese mismo término tener más una definción, como muestra más arriba lo que significa cada tipo de lista. Por último, cabe resaltar que no tienen ninguna etiqueta que separe los términos entre si, solo se escribe el término con su definición y debajo el siguiente término con su respectiva definición.

Atributos de las listas

Las UL y las OL, tienen cada una un par de atributos que es probable que en algún momento necesites que tengan unas especificaciones concretas.

Para las OL tenemos los atributos type y start. El atributo se le asigna a la etiqueta OL o a la etiqueta UL según el caso.

Para OL

type: Es para darle estilos a la numeración. Los posibles valores son: 1, A, a, I, i. Los valores I e i es en representación de los números romanos.
start: Es para darle inicio a la secuencia, debe ser un número entero. Por ejemplo si tenemos el type="a" y tenemos declarado start="5", pues empezará a contar desde la letra e, y lo mismo para los otros valores que tenga type.

Para UL

type: Para darle estilos a los items de la lista. Posibles valores que tiene son: disc, square, circle.