Índice

La composición de las listas

1. Las propiedades

Las propiedades relativas a la composición de las listas se encuentran en la categoría Texto.

images/10OWT-14.PNG

Esta categoría le permitirá componer listas desordenadas y listas numeradas.

2. La propiedad list-style-position

Esta propiedad permite indicar si la viñeta debe estar en la lista del texto (inside) o en el exterior (outside) cuando los ítems se ordenan en varias líneas.

En este ejemplo hemos escogido una imagen (vineta.gif) y la hemos colocado dentro del texto (inside).

images/10OWT-15.PNG

El resultado en el navegador:

images/08sf008.png

3. La propiedad list-style-image

Esta propiedad permite seleccionar una imagen en sustitución de las viñetas o números.

images/10OWT-16.PNG

4. La propiedad list-style-type

Esta propiedad permite seleccionar el tipo de lista que desea utilizar. Estos son los valores más habituales: 

disc

Lista con viñetas con punto negro.

circle

Lista con viñetas con punto hueco (blanco).

square

Lista con viñetas con cuadrado.

decimal

Lista numerada con cifras.

lower-roman

Lista numerada con números romanos en minúscula.

upper-roman

Lista numerada con números romanos en mayúscula.

lower-alpha

Lista numerada con letras en minúscula.

upper-alpha

Lista numerada con letras en mayúscula.

none

Sin numeración.

images/10OWT-17.png

En este ejemplo tenemos dos listas: la primera con el valor square y la segunda con el valor upper-alpha

images/10OWT-18.png

El tipo de lista inicial (lista simple con viñetas o lista numerada) no tiene importancia.