[Résolu] Eviter duplication de code

Bonjour à tous,

Imaginons que nous avons:

partie HTML:

<div class="toutbeau"> Coucou </div>
<div class="toutbeau"> Bonjour </div>

partie CSS:

div {
blbalblbalbla :beaucoup beaucoup de lignes pour mettre en forme le div
}

Maintenant je voudrais par exemple que pour "Coucou" il y ait un "background rouge" et pour "Bonjour" un "background vert".

Seulement je pense que la solution de faire:
partie HTML:

<div class="toutbeau-en-rouge"> Coucou </div>
<div class="toutbeau-en-vert"> Bonjour </div>

n'est pas une solution car je vais dupliquer trop de codes.

Existe il une solution pour éviter ça, par exemple mettre 2 classes à la suite ?
Modifié par danae (14 Sep 2006 - 21:24)

danae a écrit :
Existe il une solution pour éviter ça, par exemple mettre 2 classes à la suite ?

Bonjour danae et bienvenue sur ce forum,

Tu peux tout à fait utiliser deux classes pour un même élément.

<p class="paragraphe test">Un paragraphe pour un test.</p>

p.paragraphe {text-align: justify;}
p.test {color: red;}

Oups j'ai honte , quand j'ai dit mettre 2 classes à la suite c'était pour rigoler je pensais pas du tout que c'était possible sinon j'aurai essayé.

Et bien merci mpop

danae a écrit :
Oups j'ai honte , quand j'ai dit mettre 2 classes à la suite c'était pour rigoler je pensais pas du tout que c'était possible sinon j'aurai essayé.

Faut pas avoir honte, moi j'ai appris ça super tard dans mon apprentissage des CSS. Il faut croire que les ressources et tutoriels mentionnent peu cette possibilité, voire pas du tout. Bien sûr il y a les spécifications, mais leur lecture n'est pas à proprement parler « pédagogique ».