Forum-webmaster
Technique - programmation => HTML / CSS / XHTML => Message commencé par: nisage le le 02-11-2012 a 12:06:33

Titre: 2 styles de liens dans le même bloc div
Posté par: nisage le le 02-11-2012 a 12:06:33

Bonjour à tous,
J'ai créé un menu de navigation pour mon site avec balises div.
Je souhaite pouvoir mettre en place 2 styles de liens dans ce même bloc.
En effet, ce qui m'intéresse, c'est que lorsque l'on clique sur un lien du menu, et bien celui-ci reste actif tout le temps quand la page correspondante est elle aussi active. Je sais que cela n'est pas possible, du moins en CSS apparemment, et je ne veux pas me mettre au PHP.... :o
Donc pour contourner ce problème, je me suis dit que le mieux serait de donner au lien qui reste actif d'autres propriétés de liens, en changeant la couleur par exemple.
Quelqu'un aurait-il quelque choses à me suggérer ?
Merci d'avance !!!

Titre: Re:2 styles de liens dans le même bloc div
Posté par: GuillaumeRoos le le 02-11-2012 a 13:03:33

Bonjour,

Si j'ai bien compris ce que vous voulez faire, il suffit d'ajouter un attribut "style="color:votre couleur"" sur le lien correspondant à la page en cours. Bien-sûr, ça oblige à réécrire le menu entièrement à chaque page mais, comme vous avez dit ne pas vouloir utiliser de php, je suppose que c'est déjà le cas :)

Titre: Re:2 styles de liens dans le même bloc div
Posté par: nisage le le 02-11-2012 a 13:13:03

Bonjour,
Merci beaucoup pour votre réponse.
En fait pour les liens de mon menu, j'ai sur ma feuille CSS écrit le code suivant pour les liens :

#barre_titre a{color :#333333;}
#barre_titre a:hover {color:#666;text-decoration:underline;}
#barre_titre a:active {color:red;}

Du coup, je ne vois pas trop comment et à quel endroit inscrire le nouvel attribut color pour le liens qui doit rester actif (donc dans une autre couleur)....... :'( :'(

Titre: Re:2 styles de liens dans le même bloc div
Posté par: nisage le le 02-11-2012 a 13:30:46

J'ai oublié de préciser, je suis méga débutant en CSS...... ;D ;D

Titre: Re:2 styles de liens dans le même bloc div
Posté par: Bluely le le 02-11-2012 a 13:48:43

Coucou
Pour la solution, il te faut ajouter un style pour chaque lien correspondant à la page en cours.
(Je n'ai pas rajouté les liens dans l'exemple)
Ex pour index.html
<ul>
<li class="actif"> accueil </li>
<li> service </li>
<li> contact </li>
</ul>

Et dans la css , tu personnalises ta classe actif
.actif{color:red;}

J'espère t'avoir aidé

Titre: Re:2 styles de liens dans le même bloc div
Posté par: GuillaumeRoos le le 02-11-2012 a 14:09:46

Citation de: nisage le le 02-11-2012 a 13:13:03
Bonjour,
Merci beaucoup pour votre réponse.
En fait pour les liens de mon menu, j'ai sur ma feuille CSS écrit le code suivant pour les liens :

#barre_titre a{color :#333333;}
#barre_titre a:hover {color:#666;text-decoration:underline;}
#barre_titre a:active {color:red;}

Du coup, je ne vois pas trop comment et à quel endroit inscrire le nouvel attribut color pour le liens qui doit rester actif (donc dans une autre couleur)....... :'( :'(


En fait, vous pouvez placer un attribut "style" directement sur l'élément dans votre code html. Voici l'exemple pour un lien :
<a href="blabla.html" style="color:#ffff00">Mon Lien</a>

Comme l'attribut de style est la dernière information css qui sera donnée au navigateur, ce sera celle qui prendra le pas sur le reste. Ça permet de créer des exceptions dans les styles.

Soit ça, soit en créant une nouvelle classe comme le suggère Bluely.

Titre: Re:2 styles de liens dans le même bloc div
Posté par: nisage le le 02-11-2012 a 15:24:36

MILLE MERCIS !!
;D


Forum-webmaster | Actionné par YaBB SE
© 2001-2003, YaBB SE Dev Team. Tous droits réservés.