Tutorial - Bordas arredondadas nas imagens

 

Kon'nichiwa~
Vim trazer um tutorial de como deixar as imagens do Blogger com borda arredondada.


Em vez de ficar arredondando toda hora no Photoshop, você pode colocar uma imagem quadrada que quando for visualizar a postagem a borda dela está redonda(não me diga)!
Enjoy~
1. Vá em Modelo>>Editar HTML e procure por:

    ]]></b:skin>

2. Antes dele cole:

    .post img {
    -moz-border-radius: 10px;
    -webkit-boder-radius: 10px;
    border-radius: 10px;
    }


Quanto mais você aumentar esses 10px mais ela vai ficar redonda, eu recomendo deixar assim mesmo, mas se você quiser mudar, tem que colocar o mesmo valor nos três para funcionar.

Se vocês quiserem colocar com o efeito opacidade, procure novamente por ]]></b:skin e cole acima dele esse código:

    .main img {
    filter:alpha(opacity=82);
    -moz-opacity:0.82;
    opacity:0.82;
    }
    .main img:hover {
    filter:alpha(opacity=100);
    -moz-opacity:1.0;
    opacity:1.0;
    duration: 50s;
    }



Espero que tenham gostado~

Nenhum comentário:

Postar um comentário