Chapter 7 - Miscellaneous Effects - 7.1 Drop Shadows: the ‘box-shadow’ property
Go to the relevant page of the specification.
- box-shadow-001 (internal)
Positive value of horizontal offset
A positive value for the horizontal offset of the 'box-shadow' draws a shadow that is offset to the right of the box.
Positive values for spread distance
Positive values of the spread distance cause the shadow to grow in all directions by the specified distance.
Negative value for blur radius
Negative values for the blur radius of the 'box-shadow' are not allowed.
Testing simple drop shadow with the box-shadow property
blur computation for box-shadow
the resulting shadow must approximate (with each pixel being within 5% of its expected value) the image that would be generated by applying to the shadow a Gaussian blur with a standard deviation equal to half the blur radius
inset spread box-shadow should show shadow.
inset box-shadow should show shadow.
outset spread box-shadow should show shadow.
box-shadow should show shadow.
Box Shadow Syntax: Reordering Components
Box shadow color, inset, and length parameters can be mixed in any order, but lengths must stay adjacent.
CSS box-shadow Test