Tutorial: Borda colorida e hover na imagem

Boa tarde pessoas. Tem um tempinho que não trago um tutorial né ?

Esse tutorial é bem simples, e deixa as imagens do blog super lindas. O resultado é igual as imagens daqui do Blog ok ? É super fácil de editar e o resultado é ótimo.

Let's Go!

1º- Vá até o HTML do seu Blog e proucure por ]]></b:skin> acima dessa tag cole:

.main img {
border: 3px solid  #f17c9d;
-webkit-transition-duration: .50s;
}
.main img:hover {
border: 3px solid #c8a2d4;
-webkit-transition-duration: .50s;
}

O código é bem simples: 3px refere-se ao tamanho, solid ao tipo de borda e #f17c9d ao código da cor. É só trocar pelo que preferir. A primeira parte do código é o que aparece sem passar o mouse e a segunda com o mouse sobre a imagem (hover). Edite como desejar e depois salve. ( créditos: Kawaii World )

Créditos: Kawaii World

Gostaram ? Kissus ~