Tipos de listas en HTML

Listas HTML (no ordenadas) y (ordenadas)

El lenguaje HTML, ya sea la versión HTML4 o la versión HTML5, posee tres tipos de listas.

Las listas no ordenadas, las listas ordenadas y las listas de descripción. (la veremos más adelante)

Cada una de estas listas se crea con una etiqueta específica de HTML:

<ul> para la lista no ordenada, <ol> para la lista ordenada

 

Los elementos de las listas se definen de la siguiente forma.

Para la lista no ordenada y la lista ordenada se emplea el elemento <li>.

Ul es el acrónimo de unordered list, lista no ordenada.
En una lista no ordenada, el orden de aparición de los elementos no es importante.
Cada elemento de la lista se define con <li>, que es el acrónimo de list item.
Los elementos de la lista se indican con símbolos, como círculos, cuadrados o rombos.

En el siguiente ejemplo, vemos el código HTML que produce como resultado la lista no ordenada que figura a continuación

 

 

 

El estilo de una lista se puede cambiar, para que en vez de un círculo relleno, un disco, sea el contorno del círculo o un rectángulo el elemento marcador.

Mismo ejemplo con el uso de <ol> "Lista Ordenada"

<ol> es el acrónimo de ordered list, lista ordenada.

En una lista ordenada, el orden de aparición de los elementos es importante.

Cada elemento de la lista se define con <li>, que es el acrónimo de list item.
Los elementos de la lista se indican con números o letras.

 

 

 

En HTML4 y HTML5 se puede emplear el atributo start que permite indicar el valor inicial
en el que debe comenzar la lista. También está el atributo type que permite indicar el tipo de numeración, como por ejemplo letras o números romanos.

En la primera lista simplemente se ha empleado la etiqueta para definir la lista ordenada.

En el ejemplo, se ha empleado el atributo style type para modificar la numeración de las listas:

con las variantes posibles de:

• letras mayúsculas,
• letras minúsculas,
• números romanos en mayúsculas
• números romanos en minúsculas.

Por último cabe destacar que podemos anidar listas ordenadas dentro de no ordenadas

y viceversa