28173 sujets

CSS et mise en forme, CSS3

je m'explique :

pour faire court, j'ai une classe qui défini certains éléments :

.simple{
	margin: 0 0 2px 0;
	padding: 0;
	background-color: #ECF6F7;
}
.simple h1{
	color: #fff;
	font-size: 0.7em;
	padding: 5px 11px;
	margin: 0;
	background-color: #133388;
}
.simple ul{
       ....

maintenant, j'aurais besoin d'un autre classe, par exemple .simpleRouge, qui a presque exactement les mêmes définitions que .simple sauf les 2 background-color.

y a t'il un moyen de créer une classe à partir d'une autre et de lui définir uniquement les attributs qui changent ?

ce qui fait que j'aurais juste à ajouter :

.simpleRouge{
	background-color: #FAA;
}
.simpleRouge h1{
	background-color: #F00;
}


je ne sais pas si j'ai été assez clair mais merci tout de même.
Modifié par achem (12 Dec 2007 - 15:31)
Bonjour,

Il te suffit effectivement de définir uniquement les nouveautés dans ta classe simpleRouge, et de faire appel aux deux classes sur ton élément, dans l'ordre :
<div class="simple simpleRouge">
  <h1>Coucou</h1>
</div>


Attention : la notion de spécificité entre ici en compte, c'est uniquement parce que tes règles ont même spécificité que ça passe bien.
Personnellement, j'écris aussi simpleRouge APRES simple dans mes css, ça m'aide à voir que c'est "une surcharge".
merci pour cette reponse , effectivement j'ai due chercher pas mal du temps sur le sujet, en croyant qu'il ya un mecanisme d'héritage comme java , finalement je suis arrivé au même résultat