Crea un sitio flash gratis

Doble línea sólida en el exterior de las imágenes

En CSSGLOBE encuentro un tutorial donde nos muestra cómo crear bordes sólidos en el exterior de imágenes y el código del estilo para poder aplicarlo. Para que veas de que hablamos dale un vistazo a algunas de las demos. La imagen que aparece a continuación nos ayudará a explicar el invento:

doble-linea

La situación es la siguiente: en la zona exterior de la imagen se ve una línea de 3px verde, y en zona interiores una de 1px de color amarillo claro. ¿Cómo lograr esto? Lo que haremos aquí es utilizar la propiedad CSS "border" exterior de la imagen y luego nos encargamos dej falso interior utilizando combinación de las propiedades de fondo (background) y el relleno (padding). Primero, añadiremos la propiedad "border" a la imagen y los valores establecidos 
img{

 border:2px solid #72a143;

}
Luego añadimos el "padding" de 1px con un fondo amarillo, 
img{

 border:2px solid #72a143;

 padding:1px;

 background:#ffeda5;

}
La imagen recibirá otr "border" en el interior de la real. Eso es todo.

Escrito por Toni

Comparte este artículo:

Estas son las categorías a las que pertenece el artículo Doble línea sólida en el exterior de las imágenes:

CSS


favoritoInsertar un Comentario


Nombre:

Email:

Comentario:

Escribe la siguiente palabra: No lo entiendes? Cambia el texto!

favoritoComentarios

No hay comentarios en este artículo.