Discussion :

[ph_anrys]

Bonjour

j'ai fait un menu qui lorsqu'on arrive sur une rubrique, le fond devient jaune. j'ai employé le css dont voici le code

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
 
#menu {
width: 100%;
margin-top:50px;
margin-left:5px;
padding: 0;
}
#menu A {
float: left;
width: 150px;
display: block;
padding:4px;
color:#000000;
background-color:#ffffff;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
border-bottom:1px solid #000000;
text-decoration: none;
}
#menu A:hover {
text-decoration: none;
background-color:#FFFF00;
color: #000000;
}

cela marche très bien mais je voudrais ajouter une petite chose mais je sais pas si c'est possible

je voudrais que pour chaque rubrique du menu la couleur de fond soit différente

merci pour votre aide

[SpaceFrog]

dans la balise de la rubrique ...

[ph_anrys]

Je ne comprends pas tres bien peux tu me donner plus d'explication car quand on change la couleur c'est la meme couleur pour tous

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
#menu A:hover {
text-decoration: none;
background-color:#FFFF00;
 
color: #000000;
}

c'est la couleur de fond que je survole que je veux changer avec une couleur differente pour chaque rubrique

merci

[spirou]

Salut !!

Tu affectes une classe ou un identifiant à chaque balise <a>, et dans le css tu défini le hover, ex :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
<ul id="menu">
  <li><a class="rubrique1" href="#"></a></li>
  <li><a class="rubrique2" href="#"></a></li>
  <li><a class="rubrique3" href="#"></a></li>
</ul>

Et :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
.rubrique1:hover{
  background: red;
}
 
.rubrique2:hover{
  background: green;
}
 
.rubrique3:hover{
  background: blue;
}

[denisC]

Ou comme le dis SF directement le style dans la balise:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
<ul id="menu">
  <li><a href='#' class="rubrique" style=":hover {background-color:teal};">AA</a></li>
  <li><a href='#' class="rubrique" style=":hover {background-color:yellow};">BB</a></li>
  <li><a href='#' class="rubrique"  style=":hover {background-color:pink};">CC</a></li>
</ul>

C'est conforme à la norme W3C (http://www.w3.org/TR/2000/WD-css-style-attr-20001025), mais ça n'a l'air de marcher ni sous IE ni sous FF. Quelqu'un a réussi à faire marcher ce genre de choses :

[Tdeny]

Fais le en DHTML...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

onmouseover="this.style.backgroundColor='#FF0000';" onmouseout="this.style.backgroundColor='#FFFF00';"