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>;
Thank you all to visiting us.
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.
