Discussion :

[C_C]

Salut,

Je voudrais savor si il est possible d'avoir des styles différents pour des éléments d'une liste (li/ul).

Ce qui m'intérésse c'est la couleur de fond des éléments d'un menu. Par exemple, je veuz que le premier élément soit bleu, le deuxième rouge, le troisième vert et ainsi de suite.

Est-ce qu'il est possible de faire cela avec du CSS?

Merci d'avance.

[HiRoN]

Bonjour,

Est-ce qu'il est possible de faire cela avec du CSS?

Oui, en leur appliquant une class spécifique

[C_C]

Tu veux dire que chaque élément doit avoir une class différente?

Si oui, ce n'est pas exactement ce que je veux parce-que le menu est construit de façon dinamique donc je ne sais pas combien d'éléments va avoir le menu.

Je voudrais avoir une classe pour la li/ul du menu et, dans cette classe, indiquer la couleur des éléments en accord avec leurs positions.

[HiRoN]

Tu veux dire que chaque élément doit avoir une class différente ?

Pas forcement...
Tu peux par exemple faire seulement 2 class (si tu souhaites faire une alternance), appliquer un CSS de ton choix à la liste (margin, padding, largeur, height etc.), sauf le background-color & color par exemple.
Et ensuite, dynamiquement leur ajouter un class="class1" ou class="class2" en fonction, qui eux contiennent les propriétés des background-color & color (à toi de voir pour cela, sans code impossible d'en dire plus)...

[C_C]

Cela m'obligerait à chercher dans le code PHP du site et ça se présente comme très compliqué.

Je pensais à la possibilité d'avoir quelque chose du genre:

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
.classe_de_la_liste
{
     margin: 2px;
     padding: 0;
}
 
.classe_de_la_liste premier_element
{
     color:#333333;
}
 
.classe_de_la_liste deuxieme_element
{
     color:#444444;
}
 
.classe_de_la_liste troisieme_element
{
     color:#555555;
}

C'est possible ça avec du CSS?

[HiRoN]

C'est possible ça avec du CSS ?

En pur CSS oui, la difficulté sera de mettre le tout en dynamique...

[C_C]

Si le menu a, par exemple, 3 éléments comment dois-je m'y prendre (je parle juste de la partie css)? Par quoi dois-je remplacer le texte que j'ai mis dans mon code (premier_element, deuxieme_element, troisieme_element)?

Le fait que le menu soit créé dynamiquement ne semble pas poser un problème puis le premier élément devera toujours avoir la même couler, le deuxième aussi et le troisième aussi.

[HiRoN]

Si le menu a, par exemple, 3 éléments comment dois-je m'y prendre (je parle juste de la partie css)? Par quoi dois-je remplacer le texte que j'ai mis dans mon code (premier_element, deuxieme_element, troisieme_element)?

Dans l'idée :

Code HTML :

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

1
2
3
4
5
<ul>
<li class="link1"></li>
<li class="link2"></li>
<li class="link3"></li>
</ul>

Code CSS :

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

1
2
3
4
5
ul { ce que tu veux; }
ul li { ce que tu veux; }
.link1 { color#333; }
.link2 { color#444; }
.link3 { color#555; }

A tester...

[C_C]

On est en train d'arriver à mon problème

Le code suivant n'existe pas:

Code :

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

1
2
3
4
5
<ul>
<li class="link1"></li>
<li class="link2"></li>
<li class="link3"></li>
</ul>

Le code qui existe est comme celui-ci:

Code :

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

1
2
3
4
5
<ul class = "menu">
<li>element1</li>
<li>element2</li>
<li>element3</li>
</ul>

Et je veux que les éléments du menu aient des couleurs de fond différentes en changeant à peine le fichier css.
Donc, dans le code css de la class menu, est-ce que je peux ajouter quelquechose pour que les couleurs de fond soient différentes?

[HiRoN]

Ok... Je comprends mieu...
Tu n'as donc pas la possibilités d'ajouter une class...
La seule solution que je vois, serai de passer par des sélecteurs mais tu risques de devoir faire fasse à des incompatibilités (notamment IE6 me semble-t-il, à vérifier).