CSS3 for Mobile - Learn HTML5 and JavaScript for Android - page 139

Figure 5-14. Border radius
box-shadow
The box-shadow property allows you to create shadows on block-level elements.
This can be handy when designs call for drop shadows with varying sizes.
Rather than using several images for different shadow styles, you can now use a
few lines of CSS.
The box-shadow property has the following format.
box-shadow: horizontal-offset vertical-offset blur spread color inset;
The horizontal-offset and vertical-offset properties dictate the position of
the shadow in pixels, blur sets the amount of blur in pixels, spread sets the
shadows spread in pixels, color sets the shadow's color, and inset sets
whether the shadow should be on the inside or outside of the element. The
inset property has a value of inset or nothing.
For instance, the following CSS will produce results similar to Figure 5-15.
.box {
width: 100px;
height: 100px;
border: 1px solid #000000;
box-shadow: 10px 10px 20px 5px #000000;
}