Las sombras interiores de imágenes y texto se utilizan ampliamente en CSS, pero también pueden reflejarse en HTML. Esto se logra usando box-shadow o text-shadow. 1.Sombra de cuadro (box-shadow) Desplazamiento horizontal y desplazamiento vertical: este es el desplazamiento horizontal y vertical. Sus valores indican en qué dirección proyectará su sombra el objeto. El radio de desenfoque es el desenfoque, el radio de extensión es el grosor de la sombra . Los elementos principales de box-shadow se pueden ver en la siguiente figura.. . 2. Sombra de texto (text-shadow) Los valores son similares a (box-shadow), pero no hay sombra extendida. Ejemplo de uso: 3.Insertar en box-shadow Para “voltear” la sombra dentro del objeto, es necesario agregar un recuadro. Si no se especifica el recuadro (valor predeterminado), la sombra estará en el exterior del elemento y creará un efecto de bloque abultado. Si la palabra clave insertada está presente, la sombra caerá dentro del bloque y creará un efecto abollado. 4.Color de sombra (RGB): Color en formato RGB: los valores del espectro rojo, verde y azul, el valor alfa es responsable de la transparencia de la sombra: *** Por lo tanto, la propiedad box-shadow le permite para agregar una o más sombras a un elemento, especificando sus parámetros separados por comas. Si la propiedad border-radius está configurada para un elemento , entonces la sombra tendrá esquinas redondeadas . A continuación se muestra un ejemplo claro que utiliza la propiedad box-shadow:: código: <*img style="box-shadow: 10px 10px 10px 10px red; margin-center: 150px;" src="//img1.liveinternet.ru/images/attach/c/0/118/414/118414115_ 0_dc4e7_3795837b_XL.jpg" width="300" height="450" ​​​​alt="0_dc4e7_3795837b_XL" /> fuente - http://habrahabr.ru/post/154211/