![[Css]Código Botão 'Pesquisar Google' Empty](https://2img.net/i/empty.gif)
[Css]Código Botão 'Pesquisar Google' 23.03.12 22:03
Olá,
Andei vendo efeitos de CSS, tem gente que gosta dos efeitos criados pela Google.Inc
Então estou disponibilizando um, qual?
O Botão que faz a pesquisa, e quando/se você passar o mouse sobre ele ele faz um efeito show! ;)
Andei vendo efeitos de CSS, tem gente que gosta dos efeitos criados pela Google.Inc
Então estou disponibilizando um, qual?
O Botão que faz a pesquisa, e quando/se você passar o mouse sobre ele ele faz um efeito show! ;)
- Spoiler:
- Código:
<style>
button.but:hover {
background-image: -webkit-gradient(linear,left top,left bottom,from(#F8F8F8),to(#F1F1F1));
background-image: -webkit-linear-gradient(top,#F8F8F8,#F1F1F1);
-webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.1);
background-color: #F8F8F8;
background-image: linear-gradient(top,#F8F8F8,#F1F1F1);
background-image: -o-linear-gradient(top,#F8F8F8,#F1F1F1);
border: 1px solid #C6C6C6;
box-shadow: 0 1px 1px rgba(0,0,0,0.1);
color: #333;
}
button.but {
background-image: -webkit-gradient(linear,left top,left bottom,from(whiteSmoke),to(#F1F1F1));
background-image: -webkit-linear-gradient(top,whiteSmoke,#F1F1F1);
-webkit-border-radius: 2px;
-webkit-user-select: none;
background-color: whiteSmoke;
background-image: linear-gradient(top,whiteSmoke,#F1F1F1);
background-image: -o-linear-gradient(top,whiteSmoke,#F1F1F1);
border: 1px solid gainsboro;
border: 1px solid rgba(0, 0, 0, 0.1);
border-radius: 2px;
color: #666;
cursor: default;
font-family: arial,sans-serif;
font-size: 11px;
font-weight: bold;
height: 29px;
line-height: 27px;
margin: 11px 6px;
min-width: 54px;
padding: 0 8px;
text-align: center;
}
</style>
</head>
<body>
<button class="but">Pesquisa Google</button>
</body>
</html>
- Créditos:
Código: Google.
Disponibilização: Eu-Raff
Mr.Hardass • 24.03.12 7:30
