08/01/2013

Como Colocar Ribbons no Blog - Hover

reconhece a imagem?

Oi pequenas,
Esse é o primeiro tutorial do blog  õ/
Os créditos vão para:
Adolescente Nerd - Onde eu achei o tuto
Keep This Dream
Smile Cherry
Kawaii World
(desculpa não colocar os nomes com link, estou com preguiça)
Vamos lá?

Preview aqui. Passe o mouse nos ribbons
Vá em Modelo, Editar HTML, dê Ctrl+F e procure por ]]></b:skin>
Acima dele cole esse código:

sidebar h2 {

font-family: Pacific; /*Nome da fonte*/
font-size: 25px; /*Tamanho da fonte*/
color: #ffffff; /*Cor da fonte*/background: url(http://1.bp.blogspot.com/-oqbvUy8rm4A/UFVY1QpwFxI/AAAAAAAAD6s/MC7xmkjyt28/s1600/SIDEBAR+TITULO+2.png) no-repeat center; /*Sua faixa e posição*/height: 29px;/*Altura da imagem*/width: 280px; /*Largura da imagem*/text-align: center; /*Alinhamento do texto*/margin-top:-5px; /*Altere se necessario*/margin-left:-9px ; /*Altere se necessario*/margin-bottom:10px ;padding:5px;width:112%; }.sidebar h2:hover {background: url(http://1.bp.blogspot.com/-ihdBsiaFkFA/UFVY6Ec07gI/AAAAAAAAD60/-eg5hL1RMwI/s1600/SIDEBAR+TITULO.png) no-repeat center; /*Sua faixa e posição*/}

No código tá tudo explicadinho, né? As partes em negrito são as que você deve colocar o link do seu ribbon.
Qualquer dúvida comente :)

3 comentários:

Comente o que quiser, contando que siga essas regras:
♥ Não fale coisas que possam ofender alguém
♥ Comente sobre o post primeiro, e depois deixe o seu recado.
♥ Os comentários que cotenham "Seguindo, segue de volta" serão ignorados.
♥ Seja feliz :)