Sabe quando você passa o mouse sobre um link aqui no blog e ele mudar de cor? Então, é esse o efeito Fade nos links. Ele vai escurecer (ou clarear, dependendo da cor que você escolher) até trocar de cor. Não entendeu? Veja um exemplo abaixo. Passe o link na palavra:
Viu? Legal, né? Agora vou explicar como fazer..
Entre em Modelo Editar HTML Prosseguir Aperte Ctrl+F e pesquise a:link { Apague esse trecho:
a:link {
text-decoration:none;
color: $(link.color);
}
text-decoration:none;
color: $(link.color);
}
a:visited {
text-decoration:none;
color: $(link.visited.color);
}
a:hover {
text-decoration:underline;
color: $(link.hover.color);
}
Agora cole isso:
a:link {
color: #E9A1C0; /*Essa é a cor do link normalmente*/
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; /*Essa é a cor dos links já visitados*/
text-decoration:none;
filter:alpha(opacity=100);
-moz-opacity: 1; -khtml-opacity: 1; opacity: 1;
}
a:hover {
color: #707070; /*Essa é a cor do link quando voce vai passar o mouse*/
text-decoration:none;
filter:alpha(opacity=100);
-moz-opacity: 1; -khtml-opacity: 1; opacity: 1;
}
color: #E9A1C0; /*Essa é a cor do link normalmente*/
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; /*Essa é a cor dos links já visitados*/
text-decoration:none;
filter:alpha(opacity=100);
-moz-opacity: 1; -khtml-opacity: 1; opacity: 1;
}
a:hover {
color: #707070; /*Essa é a cor do link quando voce vai passar o mouse*/
text-decoration:none;
filter:alpha(opacity=100);
-moz-opacity: 1; -khtml-opacity: 1; opacity: 1;
}
Feito isso automaticamente o traço sublinhado irá sumir.. ;D
Cores? Veja a tabela aqui!
