De novo trazendo mais uma partilha de botões bem legais ,simples de aplicar,e super util nos posts além de ficar bem bonito e dito isto vamos colocar este novo gadget terminadinho de personalizar...
Exemplo imagem acima e aqui pode ver online: Entre aqui
Depois de ver resultado vamos aplicar css:
ANTES DE TUDO FAÇA UMA CÓPIA SEU TEMPLATE...
Agora entre no modelo seu blog e clik em html,depois procure este código:
E acima dele coloque código abaixo:
/**--inicio botoes css http://best-tuga.blogspot.pt/--**/
.botao-bt{
padding:10px 15px 10px 15px;
font-family: Bobber, Oswald;
text-decoration: none;
color: #000;
text-shadow:none;
display:inline-block;
cursor:pointer;
font-size:15px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-moz-box-shadow:0 1px 3px rgba(0, 0, 0, 0.25);
-webkit-box-shadow:0 1px 3px rgba(0, 0, 0, 0.25);
box-shadow:0 1px 3px rgba(0, 0, 0, 0.25);
border-bottom: 1px solid rgba(0,0,0,0.25);
outline:none;
position:relative;
text-shadow:0 -1px 1px rgba(0, 0, 0, 0.25);
margin:10px;
}
.botao-bt{
background-color: #FF6347;
}
.botao-bt:hover{
background-color: #FF7F50;
-moz-box-shadow:0 1px 11px rgba(0, 0, 0, 0.45);
-webkit-box-shadow:0 1px 11px rgba(0, 0, 0, 0.45);
box-shadow:0 1px 11px rgba(0, 0, 0, 0.45);
}
.botao-bt:active{
top: 1px;
left:1px;
}
/**--fim botoes css http://best-tuga.blogspot.pt/--**/
Vamos colocar html ,prepare o seu post e depois coloque este código .
<a href="#" class="botao-bt">exemplo1</a>E foi final da aplicação ,simples espero lhe seja util foi mais uma das minhas partilhas ,duvidas disponha sempre,até mais...
<a href="#" class="botao-bt">exemplo2</a>
<a href="#" class="botao-bt">exemplo3</a>
<a href="#" class="botao-bt">exemplo4</a>
Mostra SmilesOculta Smiles