Create a Drop Shadow

If you would like to create drop shadows, account for old and new browsers. Most new browsers will recognize box-shadow, available with CSS3. However, browsers not recognizing CSS3 may appreciate -mos and webkit variations.

In each case, there are 4 parameters to the shadow declaration. These are:

• param 1: horizontal offset of shadow.
• param 2: vertical offset of shadow.
• param 3: blur of shadow. (0 = no blur)
• param 4: spread of shadow. (0 = shadow is same size as blur)

Create an Inner Shadow

If you would like to create a 3D curve effect on the edge of a box, there is an option in the box shadow. This is available in CSS3, and special case options for moz and webkit browsers.

The parameters are the same as the standard box-shadow, with the addition of a clarifying parameter “inset.”