What is css3 drop shadow?

• CSS stands for Cascading Style Sheets
• Styles define how to display HTML elements on a web page

CSS3 is the third generation (level 3) of CSS.

CSS3 offers a bunch of new ways you can write CSS rules with new CSS selectors, as well as a new combinator, and some new pseudo-elements.

The box-shadow property of CSS3 allows designers to easily implement multiple drop shadows (outer or inner) on box elements, specifying values for color, size, blur and offset.

For example,

#myshadow1 {

box-shadow: 10px 10px 5px #8a8a8a;

}

The first two attributes of each of the properties are the horizontal and vertical offsets for the shadow, the third is the blur radius, and the final one sets the color of the drop shadow.

For browser compatibilities, you will need to write something like this:

-moz-box-shadow: 3px 3px 3px #8a8a8a;

-webkit-box-shadow: 3px 3px 3px #8a8a8a;

box-shadow: 3px 3px 3px #8a8a8a;