How to use CSS drop shadows for web designers
CSS box shadow is used in casting shadows off block-level elements like <DIVS>. Both CSS rounded corners and CSS drop shadows can make website updates and maintenance a breeze compared to cutting out images and using background elements.
Hello this is a box shadow
The structure of the above element is:
-moz-box-shadow: 3px 3px 5px 6px #ccc;
-webkit-box-shadow: 3px 3px 5px 6px #ccc;
box-shadow: 3px 3px 5px 6px #ccc;
The structure consists of:
- horizontal offset: a positive number indicates that shadow will fall on the right of the box
- vertical offset: a positive number indicates that the shadow will be below the box
- blur radius: This optional attribute indicates how blurred the shadow will be
- spread radius: Increase the size of your CSS shadow with a positive number for this attribute
- Color: You can dictate the color of your shadow as well
