Course Technology Cengage Learning New Perspectives on HTML5 and CSS3, 7th Edition
Tutorial 4

CSS box-shadow style

This page demonstrates how to apply the CSS3 box-shadow style. Use the input controls to specify the background color of the box in the Preview window. You can then apply a box shadow by specifying whether to place the shadow outside the box (default) or within (inset) and setting shadow color, offset in the horizontal and vertical direction, blurring size, and shadow spread. All distances are expressed in pixels. The corresponding CSS3 style rule is displayed in the Style box.

background-color
shadow placement
shadow-color
shadow offset x
shadow offset y
shadow blur
shadow spread

Preview

Style

none