Tutorial - Efeito CSS3 Elegante para Imagens das Postagens

Ganhe dinheiro para compartilhar os seus links!

Entre no painel do seu blog
Após isso clique no Botão "Editar HTML".
Depois segure as teclas Ctrl+F e procure por: ]]>

Acima da linha citada cole o seguinte código:


.post-body img {border: 1px solid #ccc;-webkit-transform: scale(0.8);-moz-transform: scale(0.8);-o-transform: scale(0.8);-webkit-transition-duration: 0.2s;-moz-transition-duration: 0.2s;-o-transition-duration: 0.2s;}
.post-body img:hover {-webkit-transform: scale(1.0);-moz-transform: scale(1.0);-o-transform: scale(1.0);opacity: 1.0;-moz-box-shadow: 0 4px 16px rgba(0,0,0,0.2);-ms-box-shadow: 0 4px 16px rgba(0,0,0,0.2);-webkit-box-shadow: 0 4px 16px rgba(0,0,0,0.2);box-shadow: 0 4px 16px rgba(0,0,0,0.2);border-image: initial;}


É pronto só visualizar se estiver correto salve e pronto!

Tweet