Personalizar o Blockquot

Foto: [http://universophotoscape.blogspot.com.br]

Tutorial de hoje é muito simples mas que dá um toque especial no blog. Vocês já devem ter visto o modelo de blockquote do blog. Caso não saibam o que é isso, é muito simples, são aquelas aspas que temos no editor da postagem:



Elas são usadas geralmente para algum tipo de citação, comentário pessoal do autor, ou mesmo destaque de algo (códigos, textoes, etc). Certo? Veja o exemplo de blockquote deste modelo de layout é este:

Aqui é um modelo de blockquote.

TUTORIAL

O código é este:

.post blockquote { 
background: #COR /* COLOQUE AQUI UMA COR */ 
border:1px solid #COR; /* ESTILO DE BORDA: COR, FORMATO E LARGURA */ 
padding: 5px; /* NÃO ALTERE */ 
margin:10px 20px 10px 20px; /* MARGEM */ 
}

Após editá-lo, você pode colar ele na área das postagens (/* Posts) ou na área acima de ]]></b:skin>.

PERSONALIZANDO:

[www] Tabela de Cores
[www] Bordas

Se quiser com as bordas arredondadas, acrescente este código logo depois da tag de borda (boder) e antes de fechar a }:

-moz-border-radius: 10px; /* Para Firefox */
-webkit-border-radius: 10px; /*Para Safari e Chrome */
border-radius: 10px; /* Para Opera */
Créditos: Cherry Bomb!