achei um tutorial incrivel no cherry bomb por isso os créditos vão a ele espero que todos gostem!!
Tem vezes que bate aquela falta falta de criatividade na hora personalizar a sidebar não é? O post de hoje vai ajudar um pouco nessas horas. Trouxe alguns estilos prontos para os títulos dos gadgets. Para usá-los é só copiar o código que gostar mais, e colar em um gadget de HTML/Javascript em seu blog. Bem fácil não é? Confira abaixo os estilos, espero que gostem!
ESTILO 1
<style>
/*Inicio título dos gadgets*/
.sidebar h2 {
font-family: Verdana;
font-size: 14px;
text-transform: uppercase;
font-weight: normal;
text-align: right;
color: #A71BDE; /*Cor da fonte*/
background: #EAE4ED; /*Cor do fundo*/
padding-right: 5px;
border-radius: 15px;
border-top: 3px solid #D1CBD4; /*Cor da borda de cima*/
border-right: 2px solid #D1CBD4; /*Cor da borda da direita*/
margin-bottom: 5px;
/* Estilos para titulo dos gadgets por www.bombadecereja.tk Não retire os créditos */ }
</style>
Estilo 2
<style>
/*Inicio Titulo dos gadgets*/
.sidebar h2 {
font-family: Georgia;
font-style: italic;
font-size: 14px;
font-weight: bold;
text-align: left;
color: #BAE0E8; /*Cor da fonte*/
border-left: 10px solid #FF78D6; /*Cor da barrinha lateral*/
padding-left: 5px;
margin-bottom: 5px;
/*Estilo para titulo dos gadgets por www.bombadecereja.tk Não retire os créditos*/}
</style>
Estilo 3
<style>
/*Inicio Titulo dos gadgets*/
.sidebar h2 {
font-family: Verdana;
font-size: 14px;
text-align: left;
color: #40250A; /*Cor da fonte*/
font-weight: normal;
background: #FFCCDF url('http://img194.imageshack.us/img194/4015/miniheart.png') no-repeat left top; /*Cor de fundo e imagem do topo*/
padding-left: 12px;
margin-bottom: 5px;
border-top: 3px solid #FA3497; /*Borda do topo*/
/*Estilo para titulo dos gadgets por www.bombadecereja.tk Não retire os créditos*/}
</style>
Estilo 4
<style>
/*Inicio Titulo dos gadgets*/
.sidebar h2 {
font-family: Georgia;
font-style: italic;
font-size: 14px;
font-weight: bold;
text-align: left;
color: #40250A; /*Cor da fonte*/
background: url('http://img194.imageshack.us/img194/4015/miniheart.png') no-repeat left top; /*imagem do topo*/
padding-left: 12px;
margin-bottom: 5px;
/*Estilo para titulo dos gadgets por www.bombadecereja.tk Não retire os créditos*/}
</style>
Eles são bem simples, mas achei que ficaram bonitinhos =3 E vocês gostaram? ^^
eu juntei 2 e fikou otimooo
ResponderExcluirque bom que te ajudou
ResponderExcluirvou usar ele no proximo desgn de algum blogger axo que vou coloquar agora no blogger do junhnho..
ResponderExcluirfaz +
ResponderExcluir