Las listas <li> ...

Elemento de lista <li>

Cada uno de los elementos de una lista ha de insertarse entre las etiquetas <li> y </li>.

Por ejemplo, para insertar en una lista los siguientes elementos:

• Perro
• Gato
• Periquito

Habría que escribir:

...
<li>Perro</li>
<li>Gato</li>
<li>Periquito</li>
...

Todos los elementos de la lista deberán encontrarse entre las etiquetas que indiquen si la lista es desordenada (con viñetas) u ordenada (numerada) como veremos a continuación.

Lista desordenada <ul>

Para que una lista sea desordenada, sus elementos deberán encontrarse entre las etiquetas <ul> y </ul>.

A través del atributo type es posible elegir el tipo de viñeta, que puede ser circle (círculo), disc (disco) o square (cuadrado).

Por ejemplo, para insertar la siquiente lista:

• Perro
• Gato
• Periquito

Habría que escribir:

<ul type="circle">
<li>Perro</li>
<li>Gato</li>
<li>Periquito</li>
</ul>

Lista ordenada <ol>

Para que una lista sea ordenada, sus elementos deberán encontrarse entre las etiquetas <ol> y </ol>.

A través del atributo type es posible elegir el tipo de numeración, que puede ser 1 (números), a (letras minúsculas), A (letras mayúsculas), i (numeros romanos en minúsculas) o I (números romanos en mayúsculas).

Por ejemplo, para insertar la siquiente lista:

1. Perro
2. Gato
3. Periquito

Habría que escribir:

<ol type="i">
<li>Perro</li>
<li>Gato</li>
<li>Periquito</li>
</ol>

Anidar listas

Es posible anidar listas dentro de otras. Estas listas pueden ser tanto desordenadas como ordenadas.

Por ejemplo, para insertar la siquiente lista:

1. Lunes
   • Ingles
   • Frances
2. Martes
   1. Ingles
      1. Correccion de ejercicios
      2. Proponer ejercicios

Habría que escribir: