Como colocar bordas nas imagens

'O tempo é muito lento para os que esperam, muito rápido para os que tem medo, muito longo para os que lamentam, muito curto para os que festejam mas, para os que amam, o tempo é eterno.' - William Shakespeare

O tempo não está passado muito rápido? Mesmo ontem era Setembro... Bem seja como for, hoje é um tutorial dedicado as imagens... Quer colocar bordas da imagens? Bem, na minha opinião fica muito bonito num blog e é uma das coisas que um blog tem obrigatoriamente de ter! É um tutorial muito simples... Quer saber como?

Então vai ficar assim: É só passar o mouse em cima e muda!

1. Vai em Design> Editar HTML.

2. Tecla Ctrl + F ou F3 e procura por a tag:

]]></b:skin>

3. Em cima dessa tag, coloque o código:

.main img {
-moz-border-radius: 03px;
-webkit-border-radius: 0px 30px 0px 30px; */ Bordas arredondadas */
-webkit-transition-duration: .70s; */ Efeito fade */
}

.main img:hover {
-moz-border-radius: 03px;
-webkit-border-radius: 30px 0px 30px 0px; */ Bordas arredondadas hover */
-webkit-transition-duration: .70s; */ Efeito fade */
}

4. Se quiseres podes editar o código de acordo ao teu gosto! 
Créditos para: winxfyrezone ❤