creating Box Shadow in html
<!DOCTYPE html><html>
<head>
<title>Box Shadow</title>
<style type="text/css">
p {
width: 100px;
height: 100px;
background-color: #e1ddda;
margin: 20px;
display: inline-block;}
p.one {
-moz-box-shadow: -5px -5px #777777;
-webkit-box-shadow: -5px -5px #777777;
box-shadow: -5px -5px #777777;}
p.two {
-moz-box-shadow: 5px 5px 5px #777777;
-webkit-box-shadow: 5px 5px 5px #777777;
box-shadow: 5px 5px 5px #777777;}
p.three {
-moz-box-shadow: 5px 5px 5px 5px #777777;
-webkit-box-shadow: 5px 5px 5px 5px #777777;
box-shadow: 5px 5px 5px 5px #777777;}
p.four {
-moz-box-shadow: 0 0 10px #777777;
-webkit-box-shadow: 0 0 10px #777777;
box-shadow: 0 0 10px #777777;}
p.five {
-moz-box-shadow: inset 0 0 10px #777777;
-webkit-box-shadow: inset 0 0 10px #777777;
box-shadow: inset 0 0 10px #777777;}
</style>
</head>
<body>
<p class="one"></p>
<p class="two"></p>
<p class="three"></p>
<br />
<p class="four"></p>
<p class="five"></p>
</body>
</html>
0 comments:
Post a Comment