Um recurso CSS muito legal e pouco conhecido e usado pelas blogueiras teens é o text shadow, que nada mais é do que um sombreado que pode ser aplicadao nos textos, dando um efeito muito bonito. Alguns blogs usam esse recurso nos títulos dos posts, veja exemplo:
O código usado para dar esse efeito é esse:
text-shadow: 1px 2px 3px #6a6a6a;
As partes em rosa e azul são equivalentes á distância do sombreado em relação ao texto. A parte em amarelo é o tamanho do esfumaçado da sombra. E o código em verde é a cor da sombra.
Você pode ir alterando esses valores para obter diferentes efeitos de sombra. Para aplicar esse efeito no titulo dos posts, siga os passos abaixo:
1 – Abra o blogger, clique em design > Editar HTML
2 – Aperte Ctrl+F e procure por: post-title
3 – Você deverá achar um código parcecido com esse:
h3.post-title, h4 {
font: $(post.title.font);
color: $(post.title.text.color);
}
4 – cole abaixo da linha:
O código da sombra que eu coloquei no começo do post. Seu código deve ficar assim:
h3.post-title, h4 {
font: $(post.title.font);
color: $(post.title.text.color);
text-shadow: 1px 2px 3px #6a6a6a;
}
5 – Visualize e salve. Você irá conseguir um efeito como abaixo:
Você pode alterar os valores e a cor da sombra para conseguir outros efeitos:
Espero que tenham gostado! Kissus
Que lindoo esse efeito!!! Amo esse blog! Ah e tem um selinho pra vc lá no meu blog! Nesse link aí! :)
ResponderExcluirhttp://blahblahblahpop.blogspot.com/2011/03/ganhei-um-selinho-e-os-ganhadores-sao.html
Ah e tem um sorteio! Participe! :)
Ficou Super legal essa dica, com esse código além de colocar nos títulos das postagens, também coloquei nos títulos dos Gadgets. Parabéns ! :D
ResponderExcluirhttp://maariihsouza.blogspot.com/
Dá um efeito bem legal o sombreado no texto, bem simples o tutorial.
ResponderExcluirhttp://www.profanofeminino.blogspot.com/
NOSSA! Aqui tem tutoriais incriveis.Amei.Parabens
ResponderExcluirAdorei este tutorial, estou usando, ficou super lindo.
ResponderExcluirJustlarie.blogspot.com visita e segue lá..
Amei o tutorial <3 ,estou usando beijos ! Comenta ?
ResponderExcluirhttp://theperfectkisses.blogspot.com/2011/03/sessao-pipoca-toy-story.html
Legal!!!
ResponderExcluirhttp://sobrecarregada.blogspot.com/
http://justdreams-ana.blogspot.com/
Nossa ! Muito show o tutorial *--*
ResponderExcluirBastante útil, vou usar no meu próximo design (:
Beijooooo
Retribui?
www.fanaticospornoticia.tk
amore faz parceria?
ResponderExcluirhttp://roundround15.blogspot.com/p/contatos-e-parcerias.html
amei o seu blog
to seguindo segue?
Oiii Liaah !
ResponderExcluirGostaria de pedir um tutorial de como
colocar essa letra : Century Gothick(uma coisa assim ) a que vse está no post !
Ppooooor favor !
Por que no design, não tem essa letra :s:s:S
Beiijos
http://busygirls-blog.blogspot.com
Adorei a dica!
ResponderExcluirmooodafeminina.blogspot.com
Vlw pela dica
ResponderExcluirJa estou utilizando o recurso no meu blog
http://blogdosmartin.blogspot.com
Amei esse tuto!!! Super útil e já esto usando!
ResponderExcluirEu não consigo nada querida da tudo errado --' porq ? eeu faço td certinho , me enquanto essas letras , feiz foi estragar meu blog : http://stardoll-glamuor-teen.blogspot.com/
ResponderExcluirnossa , se arrependimento matasse ...
Wow! Amei seu blog. Cara, tbm sou evangélica e incompreendida pela maioria por minhas atitudes serem diferentes dos ñ cristãos ^_^
ResponderExcluirSimplesmente amei o tutorial.
Consegui fazer, ficou massa demais :D
Adorei, usei nesse blog, não é meu mas estou fazendo o layour :*
ResponderExcluirNathália Duarte
O meu não tem, ja revirei o EDITAR HTML e não axei S:
ResponderExcluirSuper fácil e muito lindo!
ResponderExcluirlittle-stylist.blogspot.com
Perfeito >.<
ResponderExcluirO meu também ñ tem, vasculhei em tudo que tinha mas não achei a tal parte com o post-title...
ResponderExcluirOi Lariii tudo bem?
ExcluirEu também estava na mesma situação que você.
Faça o seguinte em vez de procurar por:
post-title
Procure por: h3.post-title a {
Ai vai aparecer o seguinte:(OBS:em baixo disso vc cola o código ta?)
h3.post-title a {
font: $(post.title.font);
color: $(post.title.text.color);
consegui com o modo CSS :D
ResponderExcluirMeu blog ta ficando perfect com os macetes que arranjo ^^
ResponderExcluirMuito interessante!
ResponderExcluirhttp://docebunny.blogspot.com.br/
Visitem nosso site; http://www.cursosquefuncionam.com
ResponderExcluir