Antes había indicado como agregar sombra a nuestro texto, ahora veamos como agregar sombra a nuestros DIV o a cualquier elemento de nuestra página web, también funciona con elementos de esquinas redondeadas aunque allí el efecto pueda no quedar tan logrado como sería en Photoshop pero no esta nada mal.
En CSS3 se agrega la sombra con una sóla línea de código aunque esta varía según el navegador que estemos utilizando
1 2 3 4 5 | .box_shadow { -moz-box-shadow: 2px 2px 4px #ffffff; /* FireFox3.5+ */ -webkit-box-shadow: 2px 2px 4px #ffffff; /* Safari 3.0+, Chrome */ box-shadow: 2px 2px 4px #ffffff; /* Opera 10.5, IE 9.0 */ } |
Y quedaría algo como esto
Los dos primeros parámetros indican la distancia en cuanto X, Y respectivamente y el último valor nos da el color de la sombra.