Comment supprimer le soulignement d'un nom au survol

123

J'ai un tel html:

<legend class="green-color"><a name="section1">Section</a></legend>

legend.green-color{
    color:green;
}

Dans mon cas, à la Sectionrecherche de vert, mais lorsque j'ai mis le pointeur de la souris dessus, il a ressemblé à un href, mais je veux qu'il reste le même sans souligner ni changer de couleur.

Est-il possible de réaliser sans changer de css ou avec un minimum de css cahnge?

ou peut-être en quelque sorte avec jquery?

html css Joper
la source

Réponses:

225

essaye ça:

legend.green-color a:hover{
    text-decoration: none;
}
Harry Joy
la source
20
FYI pour les personnes utilisant Bootstrap ... J'avais besoin d'utiliser "! Important" après "aucun" pour que cela fonctionne. Exemple: a: hover {text-decoration: none! Important; }
JustBlossom
19

Supprimer la décoration de texte de la balise d'ancrage

<a name="Section 1" style="text-decoration : none">Section</a>
Adithya Surampudi
la source
4
Il est considéré comme une mauvaise pratique d'utiliser des styles en ligne. Il est préférable de séparer le HTML des styles pour réduire les travaux de maintenance par la suite.
7
Je ne veux pas évoquer une guerre des flammes ici, mais j'aime ce style en ligne. Je veux dire que mon fichier HTML a juste besoin de ce type de style une ou deux fois. Je ne vois pas le temps justifié par la création d'une feuille de style séparée, même la séparation est une bonne pratique.
user3454439
6

Vous pouvez utiliser CSS legend.green-color a:hoverpour le faire.

legend.green-color a:hover {
    color:green;
    text-decoration:none;
}
Petit collisionneur de hadrons
la source
5

Pour conserver la couleur et éviter un soulignement sur le lien:

legend.green-color a{
    color:green;
    text-decoration: none;
}
Chris
la source
3

Vous pouvez attribuer un identifiant au lien spécifique et ajouter du CSS. Voir les étapes ci-dessous:

1.Ajoutez un identifiant de votre choix (doit être un nom unique; ne peut commencer que par du texte, pas un nombre):

<a href="/abc/xyz" id="smallLinkButton">def</a>

  1. Ajoutez ensuite le CSS nécessaire comme suit:

    #smallLinkButton:hover,active,visited{

      text-decoration: none;
      }
Raymond Wachaga
la source
2 

legend.green-color{
    color:green !important;
}
Développer l'extrait

BaiJiFeiLong
la source