Los tipos de listas más usadas en HTML son las listas ordenadas (usando la etiqueta <ol>) y las listas no ordenadas (con <ul>).
Independientemente del tipo de lista, usaremos la etiqueta <li> para indicar cada elemento de la misma.
Veamos los atributos de cada tag:
<ul
type: marca de los elementos de la lista (circle | disc | square). Sólo en modo transitional.
>
</ul>
<ol
start: número en el que comenzará la lista. Sólo en modo transitional.
type: estilo de cada elemento de la lista (a | A | i | I | 1). Sólo en modo transitional.
>
</ol>
<li
type: marca de los elementos de la lista (circle | disc | square | a | A | i | I | 1).
value: valor (numérico) que tendrá el elemento. Sólo en modo transitional.
>
</li>
Veamos un ejemplo:
<html>
<head>
<title>Página WEB de ejemplo: listas</title>
</head>
<body>
<ol>
<li>Opción 1</li>
<li>Opción 2</li>
<li>Opción 3</li>
</ol>
<ul>
<li>Opción 1</li>
<li>Opción 2</li>
<li>Opción 3</li>
</ul>
</body>
</html>
Con HTML es posible crear listas anidadas poniendo otra dentro de una etiqueta <li>, como podemos ver en el siguiente ejemplo.
<html>
<head>
<title>Página WEB de ejemplo: listas</title>
</head>
<body>
<ol>
<li>Opción 1</li>
<li>Opción 2
<ul>
<li>Opción 2A</li>
<li>Opción 2B</li>
<li>Opción 2C</li>
</ul>
</li>
<li>Opción 3</li>
</ol>
</body>
</html>
En las listas ordenadas podemos usar el atributo type para configurar el estilo de cada elemento de la lista, pudiendo tomar uno de los siguientes valores: 1, 'A', 'a', 'I', 'i'.
En las listas desordenadas dicho atributo podrá tener uno de los siguientes valores: disc, square o circle.
Dicho atributo se puede poner tanto en la etiqueta <ol> (para que se aplique a toda la lista) como en <li> (para cada elemento de forma individual).
Otro atributo que podemos usar en las listas ordenadas es start, para indicar desde qué número debe comenzar.
Veamos un ejemplo:
<html>
<head>
<title>Página WEB de ejemplo: listas</title>
</head>
<body>
<ol type="I" start="5">
<li>Opción 1</li>
<li>Opción 2</li>
<li>Opción 3</li>
</ol>
<ul type="square">
<li>Opción 2A</li>
<li>Opción 2B</li>
<li>Opción 2C</li>
</ul>
<ol type="a">
<li type="i">Opción 1</li>
<li type="I">Opción 2</li>
<li type="1">Opción 3</li>
</ol>
</body>
</html>
Los atributos type y start se encuentran desactualizados en HTML 4: se recomienda usar CSS en su lugar.
Relacionado: [ Listas en CSS ]
Para crear listas anidadas, aunque es posible usar las etiquetas HTML mencionadas en el punto anterior, también podemos hacerlo creando listas de definición utilizando <dl> (define el comienzo y final de lista), <dt> (cada opción o término de la lista) y <dd> (definición de cada opción).
Dichas tags HTML aparte de los atributos estándar no tienen otros que merezca la pena reseñar.
