Links em fade e sem sublinhado

Hi,como vão?

Eae pessoal,estou aqui de novo,e irei postar mais um tutorial...Irei ensina-los a como tirar os sublinhado dos links e colocar ele em fade , o resultado é bem bonito , bem melhor que o sublinhado horrivel , então...Veja um exemplo de como fica bem aqui.Fica bem bonito né?

1-Vá no seu HTML e procure por  a:link { para facilitar sua busca aperte CTRL + C ou F13.E apague o seguinte código:

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

E no lugar coloque o seguinte código:

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

Mude apenas o destacado,no 0.7s é quantos segundos demora o hover do link.Se você ver os links da sidebar não irão mudar,novamente você procure por .sidebar .widget a:link { você irá encontrar um código parecido com esse:

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

Apague ele totalmente,você poderá ver que os links da sidebar ficou igual aos do post.Se você quiser apenas tirar o sublinhado faça o seguinte:

Procure por a:hover { e logo abaixo onde tem text-decoration:underline; mude para text-decoration:none; e pronto! Beeijos e até o próximo post.

Credits [x]