Come rimuovere la sottolineatura da un nome al passaggio del mouse

123

Ho tale html:

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

legend.green-color{
    color:green;
}

Nel mio caso Sectionsembra verde, ma quando ho posizionato il puntatore del mouse su di esso è diventato simile a un href, ma voglio che rimanga lo stesso senza sottolineare e cambiare colore.

È possibile ottenere senza cambiare css o con un minimo di css cahnge?

o può essere in qualche modo con jquery?

html css

— Joper
fonte

225

prova questo:

legend.green-color a:hover{
    text-decoration: none;
}

— Harry Joy
fonte

20

Cordiali saluti per le persone che usano Bootstrap ... avevo bisogno di usare "! Important" dopo "none" perché funzionasse. Esempio: a: hover {text-decoration: none! Important; }

— JustBlossom

19

Rimuovi la decorazione del testo per il tag di ancoraggio

<a name="Section 1" style="text-decoration : none">Section</a>

— Adithya Surampudi
fonte

4

È considerata una cattiva pratica usare gli stili in linea. È meglio separare html dagli stili per ridurre il lavoro di manutenzione in seguito.

7

Non intendo tirare fuori una guerra di fiamme qui, ma mi piace questo stile in linea. Voglio dire che il mio file HTML ha solo bisogno di questo tipo di stile una o due volte. Non vedo il tempo giustificato dalla creazione di un foglio di stile separato, anche la separazione è una buona pratica.

— user3454439

6

Puoi usare CSS sotto legend.green-color a:hoverper farlo.

legend.green-color a:hover {
    color:green;
    text-decoration:none;
}

— Piccolo Hadron Collider
fonte

5

Per mantenere il colore e impedire una sottolineatura sul collegamento:

legend.green-color a{
    color:green;
    text-decoration: none;
}

— Chris
fonte

3

Puoi assegnare un ID al link specifico e aggiungere CSS. Vedere i passaggi seguenti:

1.Aggiungi un ID a tua scelta (deve essere un nome univoco; può iniziare solo con testo, non un numero):

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

Quindi aggiungi il CSS necessario come segue:

#smallLinkButton:hover,active,visited{

      text-decoration: none;
      }

— Raymond Wachaga
fonte

2

legend.green-color{
    color:green !important;
}

Espandi lo snippet

— BaiJiFeiLong
fonte