10 de dez de 2013

Tutorial : Efeito fade nos links .

(100+) Likes | Tumblr
Por que tão lindo ? :3


Oi :3
Gostaram do layout novo do blog ? *-* 
Eu amei .
Então . Hoje eu vou ensinar vocês a colocar o efeito fade nos links do blog .
Masoqueéefeitofade ? 
Então clique em Leia Mais e vamos começar .
Clique em Modelo > Editar HTML > Aperta CTRL + F e procure por a:link { , vai aparecer esse código aqui :
a:link {
text-decoration:none;
color: $(link.color);
}
a:visited {
text-decoration:none;
color: $(link.visited.color);
}
a:hover {
text-decoration:underline;
color: $(link.hover.color);
}
Apague essa parte e cole no mesmo lugar esse código aqui :
a:link {
color: #E9A1C0; /* Cor do link*/
text-decoration: none;
-webkit-transition: color 0.7s ease-out;-moz-transition:
color 0.7s ease-out;transition: color 0.7s ease-out;
}
a:visited {
color: #33CCCC; /*Cor dos links visitados*/
text-decoration:none;
filter:alpha(opacity=100);
-moz-opacity: 1; -khtml-opacity: 1; opacity: 1;
}
a:hover {
color: #707070; /*Cor do link quando passa o mouse*/
text-decoration:none;
filter:alpha(opacity=100);
-moz-opacity: 1; -khtml-opacity: 1; opacity: 1;
}
Agora é só modificar aonde está em negrito .
Mas se você quiser colocar o efeito na sidebar também é só procurar pelo código abaixo , quando achar é só apagar .
.sidebar .widget a:link {
  color: $(widget.link.color);
  text-decoration: none;
}
.sidebar .widget a:visited {
  color: $(widget.link.visited.color);
}
.sidebar .widget a:hover {
  color: $(widget.link.color);
  text-decoration: underline;
}
Agora é só visualizar e salvar se estiver tudo certo .


2 comentários:

  1. Aww que legaal esse tuto! Vou usar para meu novo lay que estou fazendo! obrigada
    Blog: http://wwwblogpapoteen.blogspot.com/

    ResponderExcluir

Antes de comentar leia umas regrinhas básicas .

- Faça críticas construtivas , não chegue aqui falando " nossa, que bosta, que lixo " , diga aonde eu posso melhorar .
- Não use os comentários como bate papo .
- NÃO PEÇA AFILIAÇÃO PELOS COMENTÁRIOS , tem uma pagina no blog pra isso , é só ir no menu .
- Não fale palavrões . É chato , escroto e inapropriado , então , por favor né ...
- Não venha com " seguindo, segue de volta " , deixe o link do seu blog , eu com certeza vou retribuir a sua visita.
- Expresse sua opinião .