Supprimer le soulignement obstiné d'un lien

Question

J'essaie de faire apparaître un lien en blanc, sans soulignement. La couleur du texte s'affiche correctement en blanc, mais le soulignement bleu persiste obstinément. J'ai essayé text-decoration: none; et text-decoration: none !important; dans le CSS pour supprimer le soulignement du lien. Ni l'un ni l'autre n'a fonctionné.

Le HTML :

<div class="boxhead">
    <h2>
        <span class="thisPage">Current Page</span>
        <a href="myLink"><span class="otherPage">Different Page</span></a>
    </h2>
</div>

Le CSS :

.boxhead .otherPage {
    color: #FFFFFF;
    text-decoration: none;
}

Comment puis-je supprimer le soulignement bleu du lien ?

Answer 1

Comme je m'y attendais, vous n'êtes pas candidat text-decoration: none; à une ancre mais à un élément span.

Essayez ça :

.boxhead a {
    color: #FFFFFF;
    text-decoration: none;
}

Answer 2

La balise d'ancrage (lien) possède également des pseudo-classes telles que visited, hover, link et active. Assurez-vous que votre style est appliqué au(x) état(s) en question et qu'aucun autre style n'entre en conflit.

Par exemple :

a:hover, a:visited, a:link, a:active
{
    text-decoration: none;
}

Voir W3Schools pour plus d'informations sur les pseudo-classes.

Answer 3

text-decoration: none !important doit l'enlever Etes-vous sûr qu'il n'y a pas un border-bottom: 1px solid en train de rôder ? (Tracez le style calculé dans Firebug/F12 dans IE)

Answer 4

Il suffit d'ajouter cet attribut à votre balise d'ancrage

style="text-decoration:none;"

Exemple :

<a href="page.html"  style="text-decoration:none;"></a>

Ou utilisez la méthode CSS.

.classname a {
    color: #FFFFFF;
    text-decoration: none;
}

Answer 5

Sans voir la page, difficile de spéculer.

Mais j'ai l'impression que vous avez peut-être un border-bottom: 1px solid blue; en cours d'application. Peut-être ajouter border: none; . text-decoration: none !important a raison, il est possible que vous ayez un autre style qui prévaut toujours sur ce CSS.

C'est là que l'utilisation du Barre d'outils du développeur Web de Firefox est génial, vous pouvez modifier le CSS juste là et voir si les choses fonctionnent, au moins pour Firefox. C'est sous CSS > Edit CSS .