LISTAS EN HTML

Fecha de Publicación: Abril 20 de 2017

LISTAS DE ELEMENTOS EN HTML

 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 (con viñetas), 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).   El type por defecto es NUMERICO.

Por ejemplo, para insertar la siquiente lista:

  i.  Perro

 ii.  Gato

iii.  Periquito

Habria 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, una lista anidada de tres niveles podria ser la siguiente:

1.    Lunes

§  Ingles

§  Frances

2.    Martes

1.    Ingles

A.    Correccion de ejercicios

B.    Proponer ejercicios