<html>
<head>
<STYLE>
button {
width:100px;
height:100px;
display:inline-block;
color:#fff;
text-decoration:none;
text-align:center;
text-shadow:1px 1px 0px #07526e;
padding-top:6px;
left:30px;
position:relative;
cursor:pointer;
border: none;
background: #109bce;
border-radius: 5px;
box-shadow: inset 0px 1px 0px #2ab7ec, 0px 5px 0px 0px #07526e, 0px 10px 5px #999;
}
button:active {
top:3px;
box-shadow: inset 0px 1px 0px #2ab7ec, 0px 2px 0px 0px #07526e, 0px 5px 3px #999;
}
button:before {
font-family: 'socialfont';
font-size: 40px;
line-height: 1em;
font-weight: normal;
color: #fff;
content:"5";
width:85px;
height:90px;
display:block;
position:absolute;
padding-top:10px;
top:10px;
text-shadow: 1px 1px 2px #07526e;
}
button:active:before {
top: 7px;
font-size: 40px;
text-shadow: 0px 3px 0px #07526e, 0px 5px 1px #07526e;
}
.btn2:before {
content:"By";
}
.btn3:before {
content:"2";
}
.btn4:before{
width:100px;
content:".Blogspot .in";
}
</style>
</head>
<body>
<br/>
<p>
<button class="btn1"></button>
<button class="btn2"></button>
<button class="btn3"></button>
<button class="btn4" style="width:170px;"></button>
</p>
</body>
</html>
0 comments:
Post a Comment