Yo ! Boa noite, hoje eu trouxe um tutorial de como colocar a imagem com bordinhas redondas e opacidade, igual tem aqui no blog, é bem fácil e simples, se reblogarem não se esqueçam dos créditos. Créditos: bc e jm
Procure por ]]></b:skin>, e acima dele cole:
.post img{-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px; }
Onde está escrito: radius: 8px; e o tamanho das bordas, quanto maior o numero, mais
redondo fica, todos devem ficar em tamanhos iguais para ficar redondo. Agora visualize
e salve.
Se quer ter as imagens com opacidade, coloque esse código acima de ]]></b:skin>
post img{-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px; -webkit-transition-duration: .20s;filter:alpha(opacity=75);
-moz-opacity:0.75;
opacity:0.70;}
.post img:hover{filter:alpha(opacity=100);
-moz-opacity:1.00;
opacity:1.00;-webkit-transition-duration: .20s;}
border-radius: 8px; -webkit-transition-duration: .20s;filter:alpha(opacity=75);
-moz-opacity:0.75;
opacity:0.70;}
.post img:hover{filter:alpha(opacity=100);
-moz-opacity:1.00;
opacity:1.00;-webkit-transition-duration: .20s;}
Adorei o tutorial *uu* Testei no meu blog de testes e o efeito ficou shooooow *---* Adorei o gif do começo, ASHUASUH'
ResponderExcluir-Epílogos e Finais.
Fico feliz que tenha gostado !! :D beijos;
ExcluirAcho lindo esse efeito também ^-^ ótimo tutorial!
ResponderExcluirBeijos
Too Kawaii
obrigada ^^
Excluirbeijos