Es curioso la de cosas que nos estamos perdiendo đ Es por ello que querĂa compartir la posibilidad de tener mĂșltiples backgrounds utilizando la propia etiqueta background-image. Lo cierto es que prĂĄcticamente todos los navegadores actuales lo soportan y creo que es una feature que deberĂamos aprovechar. Veamos el ejemplo :):
[html title=»Código HTML»]<!DOCTYPE html >
<html>
<head>
<title>Multiple Backgrounds</title>
</head>
<body>
<div id="example">
</div>
</body>
</html>[/html]
[css title=»Estilo»]#example
{
width: 100%;
height: 530px;
background-image: url(https://www.returngis.net/wp-content/uploads/pics/demos/worm.png), url(https://www.returngis.net/wp-content/uploads/pics/demos/grass.jpg);
background-position: center bottom,center bottom; /*You don’t need type this twice*/
background-repeat:no-repeat;
}
â[/css]
Lo Ășnico que estoy haciendo para poder trabajar con mĂșltiples backgrounds es separar cada una de las imĂĄgenes con una coma y colocĂĄndolas en el orden que se deben superponer. En este caso, queremos que el personaje del Worms aparezca encima del paisaje de fondo, por lo que ocuparĂĄ el primer lugar en la sucesiĂłn de imĂĄgenes. Por otro lado, podemos hacer uso de background-position para determinar la posiciĂłn de cada una de las imĂĄgenes de la misma forma, separando por comas.
Por Ășltimo, un punto a tener en cuenta es que si el valor de la propiedad es el mismo, no es necesario ponerlo explĂcitamente por cada una de las imĂĄgenes, sino que podemos indicar el valor solamente una vez y serĂĄ aplicado a todo el conjunto, como ocurre en el caso de background-repeat.
Espero que sea de utilidad, a la par que interesante đ
ÂĄSaludos!
Multiple Backgrounds con #CSS3 http://t.co/TazPHqMg
RT @0GiS0: Multiple Backgrounds con #CSS3 http://t.co/TazPHqMg
RT @0GiS0: Multiple Backgrounds con #CSS3 http://t.co/TazPHqMg
EXCELENTE HERMANO!!!!
Saludos desde Antofagasta, Chile.
Muchas gracias!
Gracias por tu comentario Ignacio đ Aunque serĂa hermana jejeje đ
ÂĄSaludos!
Justo lo que buscaba, me ha funcionado perfectamente, excelente aporte.. muchas gracias..
Hola , alguien sabe como hacer esto mismo pero que se muestre una imagen y despues de un intervalo de tiempo que se muestre la otra o las otras.