28172 sujets

CSS et mise en forme, CSS3

Héritage du text-decoration

Bonjour à tous!

J'ai une question qui me semble un peu bête, j'ai un trou de mémoire...

J'ai utiliser ceci:


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

a:hover {
	text-decoration : none;
}


Mais quand je veux mettre, text-decoration: underline; dans une class ou un div, et bien elle n'est pas pris en compte, comment peut on faire pour empêcher l'héritage?

Merci!
Imaginons que dans mon fichier css je mette dès le début:


a:link, a:visited {

	text-decoration: none;

}

a:hover {

	text-decoration : none;

}


Et qu'ensuite j'ai la class "exemple" à laquelle je veux que les liens à l'intérieur de cette classe soit souligné, je fais donc:


.exemple a{
text-decoration : underline;
}


Mais ça ne marche pas.
Modifié par dodpeps (31 May 2011 - 15:41)
Bonjour,

Peux tu joindre un exemple (code html / lien vers page) pour qu'on puisse regarder ce qui va pas, car au niveau du css si tu mets bien dans le bon ordre (à savoir a:link...a:hover...puis .exemple a) ça ne vient pas de là
Je crois aussi que ça ne vient pas de là.
Si tu essaies ceci, cela devrait marcher. Je l'ai testé!
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  "http://www.w3.org/TR/html4/loose.dtd">
<html><head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<title>CSS</title>
<style type="text/css">
a:link {text-decoration:none}
.exemple a:link {text-decoration : underline;}
</style>
</head>
<body>
<div>
	Ceci est mon premier DIV avec un lien non souligné.<br>
	<a href="#">Lien</a>
</div>
<div class="exemple">
	Ceci est mon second DIV avec un lien souligné.<br>
	<a href="#">Lien</a>
</div>
</body></html>
Est ce que ça réagit différemment quand on a deux fichiers css?

Quand la classe "exemple" est dans template2.css par exemple et le reste de la css dans template1.css .
Modifié par dodpeps (31 May 2011 - 16:21)
J'ai réussi!

par contre je ne serai l'expliquer, j'ai ciblé la classe différemment en en prenant une autre, et ça marche...
Avec certaines précautions, non, puisqu'on pourrait tout mettre dans une seule feuille de style (c'est même conseillé).
Il faut bien faire attention à l'ordre: il ne faudrait pas que a:link vienne plus loin après .exemple a:link, par exemple, sinon le a:link de la classe 'exemple' est 'écrasé'.
lddsoft a écrit :
Il faut bien faire attention à l'ordre

Et aussi à la priorité des sélecteurs.
De mémoire:
- a a une priorité de 0001
- a:link a une priorité de 0011
- .test a a une priorité de 0011
- .test a:link a une priorité de 0021
Sujet clos
Aller à