|
<!DOCTYPE html> |
|
<html> |
|
<head> |
|
<meta http-equiv="Content-type" content="text/html; charset=utf-8"> |
|
<title>butao</title> |
|
|
|
</head> |
|
<body> |
|
<style type="text/css" media="screen"> |
|
@import url(http://fonts.googleapis.com/css?family=Gochi+Hand); |
|
|
|
body { |
|
background-color: #FAF2CC; |
|
margin: 20px; |
|
} |
|
|
|
.verde { |
|
background: rgb(157,213,58); /* Old browsers */ |
|
background: -moz-linear-gradient(top, rgba(157,213,58,1) 0%, rgba(161,213,79,1) 50%, rgba(128,194,23,1) 51%, rgba(124,188,10,1) 100%); /* FF3.6+ */ |
|
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(157,213,58,1)), color-stop(50%,rgba(161,213,79,1)), color-stop(51%,rgba(128,194,23,1)), color-stop(100%,rgba(124,188,10,1))); /* Chrome,Safari4+ */ |
|
background: -webkit-linear-gradient(top, rgba(157,213,58,1) 0%,rgba(161,213,79,1) 50%,rgba(128,194,23,1) 51%,rgba(124,188,10,1) 100%); /* Chrome10+,Safari5.1+ */ |
|
background: -o-linear-gradient(top, rgba(157,213,58,1) 0%,rgba(161,213,79,1) 50%,rgba(128,194,23,1) 51%,rgba(124,188,10,1) 100%); /* Opera 11.10+ */ |
|
background: -ms-linear-gradient(top, rgba(157,213,58,1) 0%,rgba(161,213,79,1) 50%,rgba(128,194,23,1) 51%,rgba(124,188,10,1) 100%); /* IE10+ */ |
|
background: linear-gradient(top, rgba(157,213,58,1) 0%,rgba(161,213,79,1) 50%,rgba(128,194,23,1) 51%,rgba(124,188,10,1) 100%); /* W3C */ |
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9dd53a', endColorstr='#7cbc0a',GradientType=0 ); /* IE6-9 */ |
|
|
|
} |
|
|
|
.btn { |
|
display: block; |
|
position: relative; |
|
text-align: center; |
|
font-family: 'Helvetica Neue'; |
|
color: white; |
|
text-decoration: none; |
|
font-size: 18px; |
|
width: 300px; |
|
padding: 10px 0px; |
|
border: 1px solid #76BA00; |
|
border-radius: 4px; |
|
font-weight: bold; |
|
text-shadow: |
|
0px -1px 0px rgba(000,000,000,0.4), |
|
0px 1px 0px rgba(255,255,255,0.3); |
|
-webkit-box-shadow: 0 8px 6px -6px black; |
|
-moz-box-shadow: 0 8px 6px -6px black; |
|
box-shadow: 0 8px 6px -6px black; |
|
} |
|
|
|
span { |
|
font-family: Gochi Hand; |
|
font-size: 22px; |
|
color: #222D37; |
|
} |
|
|
|
.intern { |
|
position: absolute; |
|
height: 42px; |
|
border: 1px solid #97D122; |
|
border-radius: 4px; |
|
top: 0px; |
|
left: 0px; |
|
width: 99%; |
|
height: 99%; |
|
} |
|
|
|
</style> |
|
|
|
|
|
<span>Still in doubts?</span> |
|
<a class="btn verde">Convince me! <div class="intern"></div></a> |
|
|
|
</body> |
|
</html> |
