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: