Chantel Jeffries
saindo do carro (+18) - FireLink
Os melhores sites para
Safadinhos e Safadinhas (+18)
Conhece o Jogo do Texto?
Use com qualquer garota!
Sites que vocês adultos
Vão Gostar - Link Fixo

Botão DEMO e DOWNLOAD Com CSS Para Blogger

Gosto de ensinar tutoriais da qual as pessoas realmente precisam em seu site mais não sabem como fazer, como por exemplo este tutorial que trago para vocês - Botão DEMO e DOWNLOAD Com CSS. Principalmente para aqueles blogs de template. 




Veja uma demonstração:




Para colocar no blogger...


Torne-se membro do site, basta clicar no botão abaixo e clicar em Seguir:


Para colocar no Blogger

Entre em "Layout" - "Adicionar um Gadget" - "HTML/JavaScript" e cole o seguinte código:
<style>
.buttonx{
float:left;
list-style:none;
text-align:center;
width: 100%;
margin:5px 0;
padding:0;
font-size:14px;
clear:both;
}

.buttonx ul {
margin:0;padding:0
}

.buttonx li{
display:inline;
margin:0;
padding:0
}

.demo {
border: none;border-radius:2px;
padding: 8px 19px !important; 
background: #E55E48; 
color: #fff !important;
text-align: center; 
text-shadow: 0 0 1px rgba(0, 0, 0, 0.3);
transition: background-color .4s ease-out 0s;
}

.download {
border: none;border-radius:2px;
padding: 8px 19px !important; 
background: #2ecc71; 
color: #fff !important;
text-align: center; 
text-shadow: 0 0 1px rgba(0, 0, 0, 0.3);
transition: background-color .4s ease-out 0s;
}

.demo:hover { 
background: #454242;
text-decoration:none 
}

.download:hover { 
background: #454242;
text-decoration:none 
}

.download:before { 
content : "\f019"; 
font-family : FontAwesome; 
font-weight : normal; 
padding :11px 11px 9px !important; 
background : #27ae60; 
margin-left : -19px; 
margin-right : 6px; 
border-radius : 3px 0 0 3px; 
font-size : 16px; 
}

.demo:before { 
content : "\f06e"; 
font-family : FontAwesome; 
font-weight : normal; 
padding : 11px 11px 9px !important; 
background : #c0392b; 
margin-left : -19px; 
margin-right : 6px; 
border-radius : 3px 0 0 3px; 
font-size : 16px; 
} 
</style>
<div style="text-align: center;">
<ul class="buttonx">
<li><a class="demo" href="LINK DA DEMONSTRAÇÃO" target="_blank">Demo</a></li>
<li><a class="download" href="LINK DO DOWNLOAD" target="_blank">Download</a></li>
</ul>
</div>
<div class="clear">
</div>
Tendo colado o código, salve e pronto!!!

Botão DEMO e DOWNLOAD Com CSS Para Blogger Botão DEMO e DOWNLOAD Com CSS Para Blogger Reviewed by Muca on 5/28/2014 09:11:00 PM Rating: 5