2.5.11 Aplicar Estilos Sombras

En CSS3, la propiedad box-shadow se utiliza para añadir sombras a las cajas:

Esta propiedad requiere los valores:

Ejemplo

Estilos

Estilos
`h2 {` `border:thin solid #00C;` `width: 300px;` `margin-left: 10px;` `padding: 5px; background-color: #09C;` `background-image: url(xml.jpg); background-position: 2 center; background-repeat: no-repeat; border-radius:7px; -webkit-border-radius:7px; box-shadow: 4px 4px 6px #aaaaaa; -webkit-box-shadow: 4px 4px 6px #aaaaaa; height: auto;` `font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;` `font-style: normal;` `font-weight: bold;` `color: #FFF;` `text-align: center;` `}`

h2 {
border:thin solid #00C;
width: 300px;
margin-left: 10px;
padding: 5px; background-color: #09C;
background-image: url(xml.jpg); background-position: 2 center; background-repeat: no-repeat; border-radius:7px; -webkit-border-radius:7px; box-shadow: 4px 4px 6px #aaaaaa; -webkit-box-shadow: 4px 4px 6px #aaaaaa; height: auto;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-style: normal;
font-weight: bold;
color: #FFF;
text-align: center;
}

Html y Resultado
`<body> <h2>CICLOS FORMATIVOS</h2> </body>`
CICLOS FORMATIVOS

Para saber más

Puedes ver todas las propiedades y atributos referente a la sombra haciendo clic en: