28220 sujets

CSS et mise en forme, CSS3

[Résolu]Style différent sur chaque lien

Bonjour à tous,
bon voilà mon petit souci :
j'ai une page ou il y a 3 lien, mais sur chaque lien je voudrais qu'il y ai un style différent quand on le survol.
lien1 ---> souligné / couleur : rouge
lien2 ---> non souligné / couleur : bleu
lien 3 ---> souligné en haut et en bas / jaune

Merci d'avance pour votre aide
Modifié par Farfadam (27 Jul 2005 - 18:07)
Salut et beinvenue sur le forum

Voila un exemple

la css
.lien1 a:hover {
color: red;
text-decoration: underline;
}

.lien2 a:hover {
color: blue;
text-decoration: none;
}

.lien3 a:hover {
color: yellow;
text-decoration: underline overline;
}


et le html
<a href="" class="lien1" title="" alt="">Blabla</a>
<a href="" class="lien3" title="" alt="">Blabla</a>
<a href="" class="lien3" title="" alt="">Blabla</a>


A+
Merci beaucoup mais ça ne fonctionne pas Smiley decu ...

<head>
<style type="text/css">
<!--
.Style123 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 9px;
	color: #000000;
}

.lien1 a:hover {
color: red;
text-decoration: underline;
}

.lien2 a:hover {
color: blue;
text-decoration: none;
}

.lien3 a:hover {
color: yellow;
text-decoration: underline overline;
}

body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}


-->
</style>

</head>
<body>

<div align="center" class="Style123">|  <a href="http://www.ovh.com/fr/" target="_blank"  class="lien3">Hebergement by OVH</a>    | <a href="droit.php" class="lien1">Tout droit réservé</a> | <a href="image.php" class="lien2">Droit à l'image</a> | <br>
</div>
</body>
Ah... Encore un homme pressé qui s'attend à ce que tout un forum s'occupe immédiatement de son problème Smiley cligne

Parfois, il faut un peu de patience, Farfadam. Mais si tu as résolu le problème tout seul, tant mieux, nous t'en félicitons.

En revanche, la moindre des politesses sera :
- de revenir indiquer ta solution, qui pourra servir à d'autres
- de revenir clore ce sujet selon les règles du forum en le marquant comme [ Résolu].

<edit> Pour info, la solution proposée comportait une erreur sur la syntaxe des sélecteurs : ce n'était pas .lien1 a:hover, mais a.lien1:hover
Modifié par Laurent Denis (27 Jul 2005 - 18:07)
Laurent Denis a écrit :
Ah... Encore un homme pressé qui s'attend à ce que tout un forum s'occupe immédiatement de son problème Smiley cligne

Parfois, il faut un peu de patience, Farfadam. Mais si tu as résolu le problème tout seul, tant mieux, nous t'en félicitons.

En revanche, la moindre des politesses sera :
- de revenir indiquer ta solution, qui pourra servir à d'autres

comme tu le dis à la fin de ton message, c'était bien une histoire avec le nom du style (j'ai trouvé un script qui faisait un truc dans le même style, et c'est là que j'ai essayé de modifier le nom)

Laurent Denis a écrit :

- de revenir clore ce sujet selon les règles du forum en le marquant comme [ Résolu].

Ha heu... oui excuser moi Smiley ohwell
Laurent Denis a écrit :

<edit> Pour info, la solution proposée comportait une erreur sur la syntaxe des sélecteurs : ce n'était pas .lien1 a:hover, mais a.lien1:hover

Bah voilà la réponse à mon problème Smiley smile

Merci quand même, votre aide ma tout de même été TRES précieuse,

@ la prochaine Smiley cligne
Laurent Denis

C'est bizarre dans mes feuilles de style j'utilise toujours .class a, .class a:visited, .class a:hover et ça marche

et surtout ça passe au validateur CSS !!!
GuizBizet, les deux syntaxes sont valides, mais elles ne visent pas la même cible Smiley cligne

- Quand tu utilises .class a, tu vas toucher les liens situés dans une liste, une div, un paragraphe... qui a la classe "class"

- Quand tu utilises a.class, tu vas toucher les liens qui ont eux-mêmes la classe "class"...
Modifié par Laurent Denis (27 Jul 2005 - 18:55)
Sujet clos
Aller à