V-Propiedades de Lista

PROPIEDADES DE LISTA

Tenemos tres propiedades para definir una lista:

List-style-type

List-style-image

List-style-position

Como en anteriores propiedades podemos reunirlas en list-style.

1-   List-style-type: Puede tomar distintos valores.

    disc: Un disco. ●
   circle: Un círculo. o
   square: Un cuadrado. ▪
   decimal: Números (1,2,3,4...).
   lower-roman: Números romanos en minúscula(i,ii,iii,iv...).
   upper-roman: Números romanos en mayúscula(I,II,III,IV...).
   lower-alpha: Letras en minúscula(a,b,c,d...).
   upper-alpha: Letras en mayúscula(A,B,C,D...).
   none: Ninguno.

   Valor por defecto: disc.

2-   List-style-image: Selecciona la imagen que se usará como marca de elemento de lista.

Puede tomar dos valores, none que es el que toma por defecto, y la url de la imagen que quieres que aparezca. Por ejemplo:

   Imagina que mi gif es ®  (tela que cosa más rara me salió). Lo subo a mis archivos o donde aloje mis imágenes, teniendo así una dirección URL. Para crear una lista con ese dibujo debería poner:

    list-style-image: url(mi.gif)

3-   List-style-position: Indica si la marca de lista aparecerá dentro del cuadro al que pertenece (esto es, alineada a la izquierda con ese contenido) inside o si, por el contrario, aparecerá fuera del cuadro (o sea, algo más a la izquierda que dicho contenido) outside.

      Mejor lo vemos con ejemplos:

        List-style-position: inside   1-primer elemento

                                               de la lista. Como ves

                                               queda dentro.

                                               2-Segundo elemento

                                               de la lista.

       List-style-position: outside   1-primer elemento

                                                   de la lista. Fijate

                                                   que el 1 queda

                                                   fuera

                                                2-Segundo elemento

                                                   de la lista.

Hay más propiedades y elementos a definir, pero creo que con estos cinco capítulos ya tenemos lo básico para empezar con la CSS. Lo que vaya apareciendo nuevo, lo iremos definiendo.

Lamento el royo, pero era necesario tener una referencia mínima antes de meternos a modificar cosas.