botão personalizado


fala galera, no tutorial de hoje estarei enscinando a como criar um botão simples em Css para seu blog.

Para começar, vá em modelo, editar html e pesquise por ]]></b:skin> insira o código a seguir logo acima dele

.botao{
font:bold 15px "Palatino Linotype", "Book Antiqua", Palatino, serif;/*textos*/
font-style:normal;
color:#ffffff;/*cor dos textos*/
background:#15a2db;/*cor do fundo*/
border:0px inset #ffffff; /*borda*/
text-shadow:0px -1px 1px #222222; /*sombras*/
box-shadow:2px 4px 2px #000c5c;/*sombras*/
-moz-box-shadow:2px 4px 2px #000c5c;/*sombras*/
-webkit-box-shadow:2px 4px 2px #000c5c;/*sombras*/
border-radius:0px 59px 0px 50px;/*relacionado a bordas do botão*/
-moz-border-radius:0px 59px 0px 50px; /*relacionado abordas do botão*/
-webkit-border-radius:0px 59px 0px 50px;/*relacionado a bordas do botão*/
width:64px;/*largura*/ 
padding:18px 70px;/*espaçamento*/
cursor:pointer;
margin:0 auto;
}
.botao:active{
cursor:pointer;
position:relative;
top:2px;
}

Para ativar o botão usa-se o código


<div class="botao">Texto do botão</div>


0 comentários:

Postar um comentário