Colocando borda nas imagens do post

Essa postagem foi atualizada e corrigida.

Que tal colocar bordas em suas imagens e deixar seu blog mais fofo ? No tutorial de hoje vou ensinar você a deixar seu blog com esse visual bem bacana. Existem duas formas para esses passos, uma é bem simples pois você não precisa mexer nas configurações de HTML do seu blog. E na segunda opção você terá que acrescentar um código ao HTML do seu blog. Mas são passos super faceis de se fazer.

Opção 1 HTML
 

No Painel do seu blog, vá em MODELO, depois em EDITAR HTML..
Você precisará colocar lá o seguinte código, antes de ]]></b:skin>
Para facilitar sua busca aperte CTRL J e digite na caixinha de busca que irá aparecer.

 .post img{

border:3px solid#000000;

 padding:2px; }

.post a:hover img {

border:3px solid#ffffff;

}

 Agora é só mudar de acordo com a cor que você deseja. 

Entendendo um pouco do código: 

.post img é a cor da borda 

.post a:hover img é a cor quando você passa o mouse por cima. 

 

 Opção 2  Painel do Blog

Para mudar as cores da borda do seu blog, é bem simples.

Você deve ir no painel do seu blog, MODELO, PERSONALIZAR, como mostra a imagem abaixo.

 

Na próxima tela, você deve escolher a opção AVANÇADO, COR DA BORDA, e então selecionar a cor da borda de sua preferência. Escolha a cor da borda que deseja nas opções de cores. Ps: Mude a opção transparente para a opção de cor de sua escolha.

Prontinho!