Está usted en Indice > Construcción > Lenguajes > CSS > Lecciones y Paso a Paso > Imagenes como hitos de las listas
Construcción
Maletín
Utilidades
Cursos
Promoción
Rentabilidad
Zona Novatos
Foros
Acceso a tu cuenta

Imágenes como hitos de las listas

Cuando creamos una lista en HTML, por cada elemento de la lista, podemos detectar dos partes: la marca o hito que inicia el elemento y el texto del item de la lista. Gracias a CSS podemos conseguir que los hitos de las listas sean imágenes, incrementando así el número de iconografias ofrecidas por la especificación de HTML (circulo, cuadrado y elipse).

Para poner una imágen en el hito del item de la lista utilizaremos la propiedad list-item-image.

OL {
   list-style-image: url(miimagen.jgp);
}

El nombre del fichero que contiene la imágen deberá de especificarse mediante una URL: url (url_del_fichero). Donde la URL podrá ser relativa (../imagenes/documento.gif)) o absoluta (http://www.aulambra.com/imagenes/documento.gif).

Si utilizamos imágenes como hitos podemos tomar la precaución de espeficar un estilo sobre los items por si acaso el navegador no encuentra el fichero con la imágen. Los estilos los especificamos mediante la propiedad list-style-type.

OL {
   list-style-image: url(miimagen.jgp);
   list-style-type: square;
}




Autor: www.aulambra.com
http://www.aulambra.com/ver.asp?id=96

Usuarios que han visto este tema también han visto...

- Cambiando de color las barras de scroll
- CSS: Etiquetas
- Cómo solucionar problemas en CSS
- Centrar DIV horizontal en CSS
- Maquetar una galería de fotos con CSS usando listas


Versión imprimible - Versión imprimible de este documento
Enviar e-mail - Enviar por e-mail este documento
Publicidad

Información legal | Política de Privacidad | Contacte con nosotros

Otro proyecto de Factoría de Internet. Copyright© 2003-2008 Factoría de Internet S.L.. Todos los derechos reservados.


Página generada el 04-12-2008 a las 04:14:23