Actualizado el 14-01-2007
versión para imprimir
listas
Las CSS1 tambien especifican algunas propiedades para las listas:
list-style-type, list-style-image y list-style-position, y su propiedad resumida asociada, list-style.
Los valores posibles de list-style-type son disc, circle, square, decimal, lower-roman, upper-roman, lower-alpha, upper-alpha, none.
Los valores posibles de list-style-image son url o none. La sintaxis es url (ruta/hacia/el/archivo)
Finalmente los valores de list-style-position son inside o outside.
La siguiente hoja de estilo, por ejemplo, define reglas de estilo para un elemento de lista ordenada <OL> y lista desordenada <UL>:
<STYLE TYPE="text/css">
UL
{ list-style-type: square; list-style-image: url(mi.gif)}
OL
{ list-style-type: lower-alpha}
</STYLE>
Observe en el ejemplo que la regla <OL> está
establecida para utilizar letras minusculas para cada elemento de lista, mientras que la regla <UL> está establecida para utilizar una imagen. Si la imagen no se puede cargar, el código indica que el delimitador de elemento de lista square debe utilizarse en su lugar.
Además, la propiedad list-style-position está
fijada en inside, mostrando texto dispuesto directamente bajo el
delimitador de lista.
Si el valor está fijado en outside, que es el inicial, el
texto se alinearía bajo el primer carácter del
elemento de lista, que está a la derecha del delimitador:
Posición exterior (outside): * Item de lista 1 segunda línea de ítem de la lista Posición interior (inside): * Item de lista 1 segunda línea de ítem de la lista
Veamos algunos ejemplos:
Lista con imagenes:
- primer elemento
- segundo elemento
- tercer elemento
- primer elemento,
segunda linea - segundo elemento,
segunda linea
- primer elemento,
primera linea - segundo elemento,
segunda linea
- primer elemento,
primera linea - segundo elemento,
segunda linea