Menu

Tutorial: Efeito sépia nas Imagens do blog

Tutorial: Efeito sépia nas imagens do blog
Oi meus Cookies :3
Como tutorial de estreia do blog, vou ensinar um código HTML muito simples,  que você pode ver passando o mouse na foto. Parece uma coisa difícil, mas é a coisa mais simples que eu já fiz >.<
Primeiro, vá até Modelo > Editar HTML. Depois, clique na caixa de texto, aperte Ctrl+F e escreva
]]></b:skin>
E cole acima dele, o seguinte código:
img {
-webkit-filter: sepia(0%);
transition:All 0.4s ease;
-webkit-transition:All 1s ease;
-moz-transition:All 1s ease;
-o-transition:All 1s ease;
}
img:hover {
-webkit-filter: sepia(100%);
transition:All 1s ease;
-webkit-transition:All 1s ease;
-moz-transition:All 1s ease;
-o-transition:All 1s ease;}
Salve e pronto! Simples não é? Até o próximo tutorial!

8 comentários:

  1. Não apareceu esse código no meu,tem outra maneira de colocar?

    ResponderExcluir
    Respostas
    1. no meu também não aparecia. vê se você está colocando na caixa de texto certa, você tem que clicar dentro do quadrado. e vê se não tem algum espaço depois da palavra :D

      Excluir
  2. O meu fica na parte inteira do topo , e não fica só no nome do blog igual o seu , oque faço ?

    ResponderExcluir
    Respostas
    1. isso é por que só aquela parte do meu blog é uma imagem, o resto é do blogger. o seu deve ser o painel inteiro :)

      Excluir
  3. consegui!!!!!! muito obrigada, mesmo!

    ResponderExcluir
  4. Não consegui por que da erro Erro ao analisar XML, linha 2213, coluna 8: Content is not allowed in trailing section.

    ResponderExcluir
    Respostas
    1. bem, você deve ter apagado alguma coisa, por que as outras pessoas conseguiram

      Excluir