Pages

Saturday, June 30

How to create CSS3 "box shadow " property




In this article,I discuss about "box shadow" property of CSS3.Basically its coding is quite simple and it is done for the attraction of people.It shows a clear view.

As shown in the above diagram,you can copy in your notepad and save it with .html extension.
If you write the following code,and open it in internet explorer,then you will get as....
.
box shadow example

This is the page heading

heyy,here is box shadow property of css3 and now enjoy it.....


Write the code in the head tag,starting with curly brackets and then write the following code ::
body{
margin:100px auto; width:800px; background:#bbb; font-family:Arial, Helvetica, sans-serif;
}
h1{font-size:2.5em; color:#333333; font-weight:normal; margin-bottom:30px; }
p{line-height:18px; font-weight:normal; font-size:0.8em;}
.whitebox{
padding:5px 20px 20px 20px;
background:#fff;
/*--Border Shadow---------------------------------------*/
-webkit-box-shadow: 5px 5px 10px #555;
-moz-box-shadow: 5px 5px 10px #555;
box-shadow: 5px 5px 10px #555;
/*------------------------------------------------------*/
/*--Border Radius, to make the box round----------------*/
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
/*------------------------------------------------------*/
}
If further any problem persist,then comment........

No comments:

Post a Comment

Popular Posts