Como colocar bordas com diversos estilos nas imagens dos posts?

Views:
<style type="text/css">
.post-body img {
outline: 1px solid #ffffff;
outline-offset: -12px;
}
</style>

ONDE MARQUEI EM VERMELHO É O CÓDIGO CSS. ALTERE PARA MUDAR CORES E ESTILOS, CONFORME EXPLICO NO TUTORIAL.


Exemplo de código CSS para borda branca, sólida:

<style type="text/css">
.post-body img {
outline: 1px solid #ffffff;
outline-offset: -12px;
}
</style>


Se quiser borda groove marrom e laranja:

<style type="text/css">
.post-body img {
outline-style:groove;
outline-width:7px;
outline-color: #FF8D3C;
outline-offset: 4px;
}
</style>


Para finalizar, uma dica extra:
Vamos supor que você, assim como eu, prefira usar só um estilo de borda em todas as imagens dos posts, automaticamente, sem precisar inserir manualmente em cada post.
Tem jeito, claro!
Basta colar este código:

.post-body img {outline: 1px solid white;outline-offset: -12px;}

Acima da tag ]]></b:skin> de fechamento no código fonte de seu template e salvar.
Altere a cor, espessura e estilo das bordas como preferir, de acordo como expliquei no tutorial.


Home Sobre mim Tutoriais Loja de templates Portfólio Fanpage