Style boxShadow attribute
- Page précédente bas
- Page suivante boxSizing
- Retour au niveau supérieur Objet Style HTML DOM
Definition and usage
boxShadow
Property sets or returns the projection (drop-shadow) of the box element.
See also:
CSS reference manual:property box-shadow
Example
Add box-shadow to div element:
document.getElementById("myDIV").style.boxShadow = "10px 20px 30px blue";
Syntax
Return boxShadow property:
object.style.boxShadow
Set boxShadow property:
object.style.boxShadow = "none|h-shadow v-shadow blur spread color |inset|initial|inherit"
Note:boxShadow
The attribute adds one or more shadows to the box. This attribute is a list of shadows separated by commas, each defined by 2-4 length values, an optional color value, and an optional 'inset' keyword. Omitted length values are 0.
Attribute value
Value | Description |
---|---|
none | Default value. The shadow is not displayed. |
h-shadow | Required. The horizontal position of the shadow. Negative values are allowed. |
v-shadow | Required. The vertical position of the shadow. Negative values are allowed. |
blur | Optional. The blur distance. |
spread | Optional. The size of the shadow. |
color |
Optional. The color of the shadow. The default value is black. Please see CSS color values, for a complete list of possible color values. Tip:In Safari (on PC),color The parameter is required. If no color is specified, the shadow is not displayed at all. |
inset | Optional. Changes the external shadow (outset) to an internal shadow. |
initial | Sets this property to its default value. See initial。 |
inherit | Inherits this property from its parent element. See inherit。 |
Technical details
Default value: | none |
---|---|
Return value: | string representing the element's property box-shadow。 |
Version de CSS : | CSS3 |
Support du navigateur
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
Support | 9.0 | Support | 5.1 | Support |
- Page précédente bas
- Page suivante boxSizing
- Retour au niveau supérieur Objet Style HTML DOM