HTML and CSS Reference
In-Depth Information
Name
box-shadow
Values:
none
| <shadow> [ , <shadow> ]*
Expansions:
<shadow>
inset
? && [ <length>{2,4} && <color>? ]
Initial value:
none
Applies to:
All elements
Inherited:
No
Computed value:
As declared with lengths made absolute and colors computed
Description:
Defines one or more shadows that are derived from the shape of the element box. Either outset
(“drop”) shadows or inset shadows can be defined, the latter with use of the optional
inset
keyword. Without that keyword, the shadow will be outset.
The four length values that can be declared are, in order: horizontal offset, vertical offset, blur
distance, and spread distance. When positive, the offset values go down and the right; when
negative, back and to the left. Positive spread values increase the size of the shadow and neg-
ative values contract it. Blur values cannot be negative.
Note that all shadows are clipped by the element's border edge. Thus, an outset shadow is only
drawn outside the border edge. A semitransparent or fully transparent element background
will notreveal an outset shadow “behind” the element. Similarly, inset shadows are only vis-
ible inside the border edge and are never drawn beyond it.
