Apply the following CSS for the shadow effect in the DIV's
2nd 0 is the vertival offset of the shadow,this 0 will give shadow on both the top and bottom of the div,Positive value like 2px will give shadow on below and Negative value like -2px will give shadow on top.
5px is for the blur of the shadow.Higher the value,higher the Blurness.0 will give sharp shadow.
2px is for spread radius or thickness of the shadow.positive increase the size and negative decrease size.
#000 is the color of the shadow.We can change to any color as required.
.shadowdiv { -webkit-box-shadow: 0 0 5px 2px #000; -moz-box-shadow: 0 0 5px 2px #000; box-shadow: 0 0 5px 2px #000; }1st 0 is the horizontal offset of the shadow,this 0 will give shadow on both the left and right side of the div,Positive value like 2px will give shadow on right side and Negative value like -2px will give shadow on left side.
2nd 0 is the vertival offset of the shadow,this 0 will give shadow on both the top and bottom of the div,Positive value like 2px will give shadow on below and Negative value like -2px will give shadow on top.
5px is for the blur of the shadow.Higher the value,higher the Blurness.0 will give sharp shadow.
2px is for spread radius or thickness of the shadow.positive increase the size and negative decrease size.
#000 is the color of the shadow.We can change to any color as required.
<html> <head> <style type="text/css"> .shadowdiv { width:200px; height:200px; -webkit-box-shadow: 0 0 5px 2px #000; -moz-box-shadow: 0 0 5px 2px #000; box-shadow: 0 0 5px 2px #000; } </style> </head> <body> <div class="shadowdiv"> Hi,This is an example div for the box shadow <div> </body> </html>
No comments:
Post a Comment