box - shadow

Hello friends, 
      After a time period we are here to describe the box-shadow in css . We will discuss how we can use it and how it will work for different browsers..
   We will teach you how to use it effectively in your file.
1.) First create a block . you can do it as follows

 display:block;

2.) Second, you can use a border so that it seems to be effective in your page.

3.) Third, now you can use box-shadow element of css. It can be used as-

  box-shadow: <attribute list>;

  In attribute list attributes may be in order as horizontal offset, vertical offset, optional blur distance and optional spread distance of the shadow . You can omit any attribute you don't need .So let we take an example-

 example : box-shadow: 10px 10px 5px;

  now you can also set color of the shadow by giving either color name or color value . Let we take an example-

  example : box-shadow 10px 10px 5px #898989;

  You can also set inset keyword if you want inner shadow means shadow going inside  we can do it as follows -

  

  example : box-shadow: inset 10px 10px 5px #898989; 

Now all given example will work well for internet explorer 9 but for Mozilla and chrome  you have to add a prefix as-

/* for mozilla */

  example_for_mozilla :  -moz-box-shadow: 10px 10px 5px #898989;

/* for chrome */

  example_for_chrome:   -webkit-box-shadow: 10px 10px 5px #898989;

---

Thank you all to visiting us.