11
votes

Comment supprimer un soulignement sur un pseudo-élément?

sur chrome et firefox, si j'applique une décoration de texte: Soulignez sur une balise, par défaut, le soulignement ne s'applique pas à l'élément pseudo. Mais sur coire, cela le fait et je ne peux pas l'enlever. Je veux que le lien soit souligné, mais pas l'élément pseudo.

Ça marche si j'ajoute une étendue à l'intérieur et mettez le soulignement dessus, mais je veux savoir s'il peut être fait sans balisage supplémentaire. P>

<a href="#" id="underline">underline</a>
<br>
<a href="#" id="color">color</a>
<br>
<a href="#" id="span"><span>with span</span></a>

html css internet-explorer

0 commentaires

3 Réponses :

1
votes

comme text-décoration: Souligné; code> ne peut pas être remplacé dans IE, vous pouvez utiliser bordure-bas: 1px solide vert; code> à la place. Cela peut ensuite être écrasé sur le : avant code> en réglant sa couleur de bordure sur la couleur d'arrière-plan (dans ce cas blanc). Cela ne fonctionnera cependant sur des arrière-plans de couleur unie.

p>



<a href="#" id="underline">Hover to check underline</a>

0 commentaires

28
votes

Il semble que c'est-à-dire que c.-à-d. Ne vous laissez pas remplacer la décoration de texte dans le pseudoplement si elle n'est pas définie. Premièrement, laissez le pseudo-élément être souligné - décoration de texte: soulignez-la - et ensuite la remplacer par TextDecoration: Aucun.

#underline:hover:before
{
	text-decoration:underline;
}

#underline:hover:before
{
	text-decoration:none;
}

2 commentaires

Bravo à vous. C'est la seule solution qui est correcte. Vous devez éditer votre réponse cependant. C'est la décoration de texte: soulignement (non souligné). Merci beaucoup, c'était un mal de tête complet. Typique c'est-à-dire.

Cela fonctionne mais ne fonctionnait pas pour moi parce que lorsque l'extraction du CSS, elle a enlevé le premier style. La solution consistait à ajouter une autre classe à la balise une balise, puis à définir la décoration de texte: aucun à ce sujet.

0
votes

Vous pouvez ajouter ceci à votre CSS. Cela m'a aidé dans l'IE

a {text-decoration:none;}
a:hover {text-decoration:underline;}
a:before,a:after { text-decoration:underline;}
a:before,a:after,
a:hover:before,a:hover:after {text-decoration:none;}

0 commentaires