terça-feira, 17 de julho de 2012

Como personalizar o "Post-footer" da área das postagens?


Irei colocar dois efeitos. A visualização deles está nas imagens :)
Design - Editar Html - Ctrl+F e pesquise por:  .post-footer { assim que você irá visualizar duas linhas abaixo pois bem, apague-as.

.post-footer {
  margin: .5em 0;
  line-height: 1.8;
}


Algumas observações
roxo apague/substitua
• escolha apenas um código a seguir e substitua.

post-footer a{
color:#363636;
text-decoration:;
font-weight: ;
}
.post-footer a:hover{
color:#FFFFFF;
text-decoration:none;
background-color:#000000
}
Algumas observações:
vermelho fundo;
lilás cor da letra;
Visualize


Lembrando que ao passar o mouse o efeito "hover" desse código é uma transição colorida (arco-íris) por isso que não tirei o print. A visualização que você viu na imagem acima, é efeito "não hover" ou seja, esse efeito é sem passar o mouse.

.post-footer a{
color:#FF0080;
background-color: #F1A9A9;
text-decoration:bold;
-webkit-transition: color 0.7s ease-out;
-moz-transition:color 0.7s ease-out;
transition: color 0.7s ease-out;
}
.post-footer a:hover{
background-color: #F1A9A9;
color: #FBD400;
text-decoration:bold;
filtrer:alpha(opacity=100);
-moz-opacity: 1;
-khtml-opacity: 1;
opacity: 1;
}
Algumas observações:
rosa cor da fonte;
preto fundo dos links;
bold negrito caso não queira mude para "none";
Visualize

tabela de cores: [www] e este [www]

Fonte do segundo códido por: [www]
Depois trago para vocês e mais e mais efeitos :) 

Nenhum comentário: