Como Botar Bordas nas Imagens de seu Blog

E aí, galerinha! Pedro por aqui mais uma vez.

Um leitor bem presente aqui no blog me pediu um favor.... Como gosto de ajudar vocês resolvi atender o pedido. Ele me pediu o código HTML das bordas coloridas, que muitos blogs tem usado ultimamente. O código é o seguinte:

.post img {
border: 3px solid #114a33;  /* Borda = Altere o número para obter a cor que quiser */
text-align: center;
background-color: #26AC77; /* Fundo. Altere os números ou as letras que vem depois do asterisco para outras cores */
padding: 4px 4px 4px 4px;
margin: 0px 0px 0px 5px;
moz-box-shadow: 1px 1px 10px #00f;
-moz-border-shadow: 30pc;
-khtml-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 5px 5px 0px 0px #cccccc;
-moz-box-shadow: 5px 5px 0px 0px #cccccc;
box-shadow: 5px 5px 0px 0px #cccccc; }

Bom, para colocá-lo no seu blog acompanhe o pequeno GIF abaixo:

Clique para poder entender!

É bem simples! As duas áreas em vermelho são editáveis de acordo com a cor que você quiser.

~Pedro G.

Nenhum comentário:

Postar um comentário