Cómo crear un efecto de sombra en html5

Sintaxis básica de box-shadow:

box-shadow: color ?h-shadowv-shadow blur spread?

color: color de sombra-- ----------opcional

h-shadow: desplazamiento horizontal----requerido

v-shadow: desplazamiento vertical Cantidad de desplazamiento-----requerido

desenfoque: distancia de desenfoque-------------opcional

extensión: tamaño de la sombra---- ------ ¿Opcional? p>

inserto: sombra interior--------------opcional

Ejemplo:

parte css:

.div1{

ancho:200px;

alto:200px;

margen:20px auto;

alto de línea: 200px;

text-align: center;

fondo: cadetblue;

borde: 2px solid darkslategray;

box-shadow: darkgrey 10px 10px 30px 5px;//Sombra de borde

}

parte html:

El efecto es el que se muestra: