|
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> |
|
<script type="text/javascript"> |
|
$(function(){ |
|
$("button").hover( |
|
function(){ $(this).addClass("hover"); }, |
|
function(){ $(this).removeClass("hover"); } |
|
) |
|
}); |
|
</script> |
|
|
|
<!--[if lte IE 9]> |
|
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta3)/IE8.js"></script> |
|
<![endif]--> |
|
|
|
<style type="text/css"> |
|
button, button span { |
|
-moz-border-radius: 4px; |
|
-webkit-border-radius: 4px; |
|
border: 0; |
|
border-radius: 4px; |
|
border-width: 1px; |
|
border-style: solid; |
|
outline: none !important; |
|
text-decoration: none; |
|
} |
|
button { |
|
cursor: pointer; |
|
font-weight: bold; |
|
padding: 0; |
|
margin: 0; |
|
text-shadow: 0 1px 0 #DDD; |
|
color: #262626; |
|
background-image: -webkit-gradient(linear, 0% 0%, 0% 90%, from(rgba(237, 237, 237, 255)), to(rgba(175, 175, 175, 255))); |
|
background-image: -moz-linear-gradient(-90deg, rgba(237, 237, 237, 255), rgba(175, 175, 175, 255)); |
|
filter: progid:DXImageTransform.Microsoft.gradient(enabled='true', startColorstr=#ffededed, endColorstr=#ffafafaf); |
|
border-color: rgba(0, 0, 0, 0.56); |
|
font-size: 13px; |
|
} |
|
button:hover, button.hover { |
|
background-image: -webkit-gradient(linear, 0% 0%, 0% 90%, from(rgba(245, 245, 245, 255)), to(rgba(185, 185, 185, 255))); |
|
background-image: -moz-linear-gradient(-90deg, rgba(245, 245, 245, 255), rgba(185, 185, 185, 255)); |
|
filter: progid:DXImageTransform.Microsoft.gradient(enabled='true', startColorstr=#fff5f5f5, endColorstr=#ffb9b9b9); |
|
} |
|
button:active { |
|
background-image: -webkit-gradient(linear, 0% 0%, 0% 90%, from(rgba(143, 143, 143, 255)), to(rgba(201, 201, 201, 255))); |
|
background-image: -moz-linear-gradient(-90deg, rgba(143, 143, 143, 255), rgba(201, 201, 201, 255)); |
|
filter: progid:DXImageTransform.Microsoft.gradient(enabled='true', startColorstr=#ffededed, endColorstr=#ffafafaf); |
|
} |
|
button span { |
|
border: 1px solid #eee; |
|
display: block; |
|
padding: 6px 8px 7px; |
|
} |
|
button:active span { |
|
border-color: #b4b4b4; |
|
} |
|
|
|
@-moz-document url-prefix() { |
|
button span { |
|
margin: -1px -3px; |
|
} |
|
} |
|
</style> |
|
|
|
<!--[if IE]> |
|
<style type="text/css"> |
|
button { border: 1px solid #707070; } |
|
button span { border: 0; padding: 6px 3px 4px; } |
|
</style> |
|
<![endif]--> |
|
|
|
<button><span>Post</span></button> |
