Box Shadows
To apply a box shadow, specify a horizontal and vertical offset from the object, the amount of blurring to add to the shadow, and the color to use, like this:
box-shadow:15px 15px 10px #888;
The two instances of 15px
specify
(in order) the horizontal and vertical offset from the element, and these
values can be negative, zero, or positive. The 10px
specifies the amount of blurring (about a
quarter of a centimeter on the average display), with smaller values
resulting in less blurring, and the #888
is the color for the shadow, which can be
any valid color value (see CSS Colors in Chapter 18). The result of this declaration can be
seen in Figure 19-4.
Note
You must use the -webkit-
and
-moz-
prefixes to this property for
WebKit- and Mozilla-based browsers.
Get Learning PHP, MySQL, JavaScript, and CSS, 2nd Edition now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.