Efeito borda e opacidade nas imagem

1 APERTE CTRL+F E LOCALIZE A TAG  ]]></b:skin>

2 ACIMA DESTA TAG COLE O CODIGO ABAIXO

  img {
border: 1px double #ccc; (espessura e cor da borda)
background: #efefef; (plano de fundo da caixa)
-webkit-transition: all 0.8s linear !important;
transition: all 0.3s ease !important;
-webkit-transition: all 0.8s ease !important;-o-transition: all 0.8s ease !important;-moz-transition: all 0.8s ease !important;
-moz-box-shadow: 0 0 20px rgba(0, 0, 0, .2);
-webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .2);
box-shadow: 0 0 20px rgba(0, 0, 0, .2);
-moz-border-radius: 0;
-webkit-border-radius: 0;
border-radius: 0;
-moz-border-radius:6px;
-webkit-border-radius:6px;
-goog-ms-border-radius:6px;
opacity:0.6
}
img:hover{
opacity:1;
-moz-box-shadow: 0 0 35px rgba(47, 94, 146, .5);
-webkit-box-shadow: 0 0 35px rgba(47, 94, 146, .5);
box-shadow: 0 0 35px rgba(47, 94, 146, .5);
-moz-border-radius: 0;
-webkit-border-radius: 0;
border-radius: 0;
-moz-border-radius:6px;
-webkit-border-radius:6px;
-goog-ms-border-radius:6px;
}

3 CLIQUE EM VISUALIZAR PARA VER SE ESTA TUDO OK E DARA PARA VER JA O EFEITO DEPOIS CLIQUE EM SALVAR PRONTO

 
Sem comentários »
17 de abr. de 2012

0 comentários :

Postar um comentário