quarta-feira, 4 de janeiro de 2012

Tutorial-Efeito opacidade nas imagens


Oi pessoal hoje tem mais um tutorial pra vocês: como colocar efeito opacidade nas imagens.
Vamos lá:
Vá no html do seu blog é procure por ]]></b:skin>, quando encontrar, coloque esse código acima dele:

.main img {
filter:alpha(opacity=82);
-moz-opacity:0.82;
opacity:0.82;
}
.main img:hover {
filter:alpha(opacity=100);
-moz-opacity:1.0;
opacity:1.0;
duration: 50s;
}
Pressione visualizar e veja se as imagens do seu blog estão meio "apagadas", se estiverem quer dizer que deu certo, então salve!  Atenção sempre visualize antes de salvar :)

Créditos: Bomba de glitter (visite)

14 comentários:

  1. Tentei colocar esse efeito no meu blog uma vez, mas não entendi o tutorial, o seu tá bem mais claro de aprender! :D www.d-e-s-n-e-u-r-a-n-d-o.blogspot.com

    ResponderExcluir
  2. Olha eu aqui de novo :b , Jojo poderia me falar como que se faz pra escrever alguma coisa dentro de um quadradinho igual o que você escreveu o código? Não precisa explicar como personalizar ele, só quero saber o básico, ou seja, como escrever dentro de um desse. Desde já agradeço! www.d-e-s-n-e-u-r-a-n-d-o.blogspot.com

    ResponderExcluir
  3. @:] Oi esse quadrinho é blockquote eu pedi um tuto nesse blog:http://blog-garotadescolada.blogspot.com/2011/06/colocando-e-personalizando-o-blockquote.html

    Mas se vc quer a caixinha de colocar html é nesse site:http://maca-envenenada.zip.net/ procure por caixinha com rolagem. Espero que ajude :) Bju

    ResponderExcluir
  4. ahm
    tuto legal
    vou colocar no meu blog de encomendas
    bjs

    gpurple.blogspot.com

    ResponderExcluir
  5. Oi,
    Conheci seu blog através do adolecentro e adorei aquii ^^
    Gostei das dicas e amei o design

    estou seguindo agora
    Beijos

    http://moniabrao.blogspot.com

    ResponderExcluir
  6. que lindo seu blog! ja virei fã! amei!
    bjs

    ResponderExcluir
  7. adorei o tutorial :3

    http://himi-tsu.blogspot.com/

    ResponderExcluir
  8. Obrigada por mandar o tutorial viu? *-*

    ResponderExcluir
  9. amei o tuto! *-* n sei se te falei, mas eu ja coloquei seu cabeçalho no blog *-* kkk ai eu mudei todo o design pra combinar melhor, se vc n viu, quando der vê lá *-*

    ResponderExcluir
  10. @Suzana Vi sim ja deixei um comentário lá e parabéns pela bike q vc ganhou :)

    ResponderExcluir
  11. Não consegui, no HTML diz que não existe o codigo ]]>

    ResponderExcluir
  12. Com a atualização do Blogger está mais complicado editar o html, aconselho a vc baixar o html do seu blog e editá-lo pelo Worldpad.

    ResponderExcluir