propiedad boxShadow de estilo

definición y uso

boxShadow establecer o devolver la sombra del elemento de cuadro (drop-shadow).

consulte también:

libro de referencia CSS:propiedad box-shadow

ejemplo

agregar box-shadow a elemento div:

document.getElementById("myDIV").style.boxShadow = "10px 20px 30px blue";

intente usted mismo

sintaxis

volver propiedad boxShadow:

objeto.style.boxShadow

establecer propiedad boxShadow:

objeto.style.boxShadow = "none|h-shadow v-shadow blur spread color |inset|initial|inherit"

comentarios:boxShadow el atributo agrega una o más sombras a la caja. Este atributo es una lista de sombras separadas por comas, cada una de las cuales se define por 2-4 valores de longitud, un valor de color opcional y una palabra clave opcional 'inset'. Los valores omitidos para la longitud son 0.

valor del atributo

valor descripción
none valor predeterminado. No se muestra la sombra.
h-shadow obligatorio. Posición horizontal de la sombra. Permite valores negativos.
v-shadow obligatorio. Posición vertical de la sombra. Permite valores negativos.
blur opcional. Distancia de desvanecimiento.
spread opcional. Tamaño de la sombra.
color

opcional. Color de la sombra. El valor predeterminado es negro.

consulte valores de color CSSpara obtener una lista completa de valores de color posibles.

consejo:en Safari (en PC),color el parámetro es obligatorio. Si no se especifica el color, la sombra no se mostrará.
inset opcional. Cambie la sombra externa (outset) a la sombra interna.
initial establezca este atributo en su valor predeterminado. Consulte initial。
inherit hereda este atributo de su elemento padre. Consulte inherit。

detalles técnicos

valor predeterminado: ninguno
valor de retorno: cadena que representa el propiedad box-shadow。
Versión de CSS: CSS3

Compatibilidad del navegador

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Soporte 9.0 Soporte 5.1 Soporte