segunda-feira, 24 de outubro de 2011
Personalizar a data de postagem
Sem criatividade para postar algo assim " ao extremo " mais tudo bem , o importante é que hoje vamos fazer nosso primeiro tutorial . Uma coisa básica: Personalizar a data de postagem
Chega de enrolação e papo mole, vamos ao tutorial, logo á baixo clicando em Leia Mais (:
>> Vá até configuração >> Formatação >> Formatação de data e o configura desta maneira , bem certinho sem acressentar nada :
.main-inner h2.date-header {
font: $(date.font);
color: $(date.text.color);
}
Logo após , substitua o mesmo por :
.main-inner h2.date-header {
font: georgia;
color: #333;
margin-right: -100px;
background: #FFB6C1;
float: right;
font-size: 11px;
padding: 4px;
}
.main-inner h2.date-header:hover {
background: #DB7093;
}
Primeiramente vamos alinhar a borda de linhagem ( alinhamento de data ) . Se o seu quadro estiver posicionado á direita não será necessário mudar o "float: right;" e o "margin-right: -100px;" se não ao contrário mude o right por left.Iremos á parte dos códigos !
font: georgia; É a fonte da data.
color: #333; É a cor da data.
margin-right: -100px; Este código é a margem externa da data, ou seja, ela ira dar o espaçamento necessário entre o quadro da postagem e o quadro da data. Quanto menor o número mais perto fica, quanto maior mais longe.
background: #FFB6C1; Cor do fundo do quadro.
float: right; Alinhamento do quadro da data.
font-size: 11px; Tamanho da fonte da data.
padding: 4px; Margem interna do quadro, ou seja, espaçamento de dentro da caixinha.
background: #DB7093; séra removido ou seja o espaço em branco quando se passa o mouse .
----------------------
Foi isso se você gostou comente , foi feito com carinho , mais caso não pegue contacte comigo pelo comentário ou C-BOX .
beeeeeeeeeijos s2

0 comentários:
Postar um comentário