♦ Tutorial ~ Efeito Borda + B&W

Hey

  Pessoal, sabem o que amanhã é??? Sim é domingo. Não, não é apenas domingo, amanhã é meu aniversário, yeahhhhhh, acho que farei um bolo arco-íris só para mim. E então, o que ganharei de vocês???                
  Me adicionem no face ou twitter para que eu possa falar com vocês, meus rilakkumas.

  Hoje eu trago um tutorial que EU criei para o layout passado, sabe a nossa elite de afiliados? As imagens tinham borda colorida e quando passava o mouse a imagem toda ficava com efeito Preto e Branco (B&W), pois bem irei ensinar agora.
 Tenho uma novidade, agora teremos preview online dos efeitos para que você possa conhece-los pessoalmente.

clica --> PRÉVIA DO EFEITO

Legal ver o efeito online néh? Eu gostei bastante

Para adicionar vá em:

Layout >> Adicionar um Gadget >> HTML/JavaScript

E cole esse código:

<style>
.blackttyb{
-webkit-transition-duration: 0.5s;
border: 3px solid #40E0D0;
}
.blackttyb:hover {
-webkit-filter: saturate(0%) ;
-webkit-transition-duration: 0.5s;
border: 3px solid #40E0D0;
}
</style>

Explicando

 3px é o tamanho da borda e #40E0D0 é a cor

Aqui tem uma tabela de cores

Agora cole esse código onde você quer que apareça o efeito

<a href="URL DO BLOG" title="NOME" target="_blank"><img src="URL_DA_IMAGEM" class="blackttyb"/></a>

Modifique o que se pede e Pronto.

 Esse efeito é fácil demais de ser usado, se houver alguma duvida fale pelo comentários.

Até amanhã no meu ANIVERSÁRIO