Como retirar ou colocar sublinhado nos links

Como retirar ou colocar sublinhado nos links

6 10 99
Como retirar ou colocar sublinhado nos links 10 6 99
Muitas pessoas me perguntam o que fazer para retirar aquele sublinhado dos links, principalmente quando passamos o mouse sobre eles.
Os links de um blog ou site que usa CSS se dividem em:
  • a:  é o link em si
  • a:visited é o link que foi visitado
  • a:hover é o estado do link quando passamos o mouse sobre ele
  • a:active é o estado do link quando clicamos nele
links
Vamos para um exemplo prático, usando o código-fonte do Template Mínima:

a:link {
  color:$linkcolor;
  text-decoration:none;
  }
a:visited {
  color:$visitedlinkcolor;
  text-decoration:none;
  }
a:hover {
  color:$titlecolor;
  text-decoration:underline;
}
Para retirar o sublinhado dos links, basta mudar a palavra “underline” para “none”
a:link {
  color:$linkcolor;
  text-decoration:none;
  }
a:visited {
  color:$visitedlinkcolor;
  text-decoration:none;
  }
a:hover {
  color:$titlecolor;
  text-decoration:none;
}
Agora, se você gosta do sublinhado, mas os links do seu blog estão sem underline, basta procurar a parte do template e fazer a mudança.
Como exemplo, vou pegar o código de um template meu e mudar os links da sidebar:
#sidebar1 a,#sidebar2 a,#sidebar3 a,#sidebar4 a {
color:#4c4c4c;
text-decoration:none;
}
#sidebar1 a:visited,#sidebar2 a:visited,#sidebar3 a:visited,#sidebar4 a:visited {
text-decoration:none;
color:#4c4c4c;
}
#sidebar1 a:hover,#sidebar2 a:hover,#sidebar3 a:hover,#sidebar4 a:hover {
text-decoration:underline;
color:#c33f00;
}
Para acessar estes códigos, entre no painel do Blogger> design>editar html.
Dica: use o Crtl+F do teclado para encontrar a parte que você está buscando.
7 Comments
Comments
  1. Até que enfim, Juliana \0/

    Sabia onde era, mas nunca conseguia retirar da linkbar. Ficava muito feio mesmo.
    Dei uma olhada com atenção nesse tutorial e vi que precisava acrescentar uma linha apenas: text-decoration: none;

    Obrigado por mais essa dica.

    Abraços

    ResponderExcluir
  2. Oi, Juliana!

    Como é simples de fazer! Agora vou aproveitar essa dica e fazer uma mudanças nos meus links!

    beijo

    ResponderExcluir
  3. Oi Juliana! Curti muito o post, e não estou conseguindo colocar o sublinhado no estado hover no titulo dos meus posts. Dá pra vc me ajudar? blogdomateushonorio.blogspot.com vlw!

    ResponderExcluir
  4. Oi Juliana!
    Muito bom o Dicas Blog, mas precisava desta informação no novo Blogger, pois não entendo muito de html. =/
    Pleaseee

    ResponderExcluir
  5. Perfeito! Estava mesmo tentando tirar aquele sublinhado do meu site =D.

    ResponderExcluir
  6. Valeu pela dica. Me ajudou demais.

    ResponderExcluir
 
Dicas Blogger© 2007-2015 | Todos os direitos reservados | Design By Duy Templates
Top