Links em fade

Como vão amores do papai? Espero que muito bem :) Quem quer mais um tutorial? Então, vamos aprender hoje a colocar os links do seu blog em fade que é quando passa o mouse nele ele muda a cor! E para quem ainda não entendeu veja o exemplo do nosso blog, ele está com os links em fade. É bem fácil de se fazer e eu espero que entendam tudo direitinho!


1 - Abra seu blog > Vá em desing > Editar HTML >
2 - Aperte F3 e procure por:a:link {

3 - Quando achar deve ter um código mais ou menos assim:

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);
}

4 - Apague todo esse código e substitua por:

a:link {
color: #E9A1C0;
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;
text-decoration:none;
filter:alpha(opacity=100);
-moz-opacity: 1; -khtml-opacity: 1; opacity: 1;
}
a:hover {
color: #707070;
text-decoration:none;
filter:alpha(opacity=100);
-moz-opacity: 1; -khtml-opacity: 1; opacity: 1;
}

5 - Faça a devidas alterações mais não salve ainda. Isso já se ativou na área dos posts. Mais se quiser ativar na sidebar tambem procure por:.sidebar .widget a:link {

6 - Deve ter um código mais ou menos assim e você deve apaga-lo:

.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;
} 

Pronto visualize e veja se está tudo certo se estiver salve!