Designer e HTML: Como colocar efeito sépia nas imagens

Como colocar efeito sépia nas imagens

Hey amoras, como primeiro tutorial do blog queria mostrar pra vocs cmo fiz o efeito sépia nas imagens quando passa o mouse em cima. É muito mais facil do que parece. Mata essa curiosidade clicando em "Continue lendo"



1- Abra o blog e vá na opçao "Modelo" depois em " Editar HTML

2-Clique dentro do codigo e aperte ctrl+f e digite ']]>

'
3-Assim que achar esse codigo, cole em cima dele o seguinte codigo:



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. O efeito vai aparecer automaticamente em todas as fotos do blog. Facil né?? Espero que tenham gostado...

Nenhum comentário:

Postar um comentário