|CSS|Definition Appel Sous-Classes en cascade
Résolu
Bonjour,
Voilà il se trouve que j'ai un peu de temps à tuer donc j'ai décidé d'apprendre le CSS.
Mon problème :
Je définie, par exemple une classe : .bouton { background-color:red; }
- Comment faire pour définir une autre sous-classe (enfant de .bouton !) qui hérite des propriétés de .bouton. Un truc genre : .bouton.actif { color:yellow }
?
- Et comment appeler ou appliquer .actif à un <span> par exemple
(pour avoir au final un texte jaune sur fond rouge)
?
D'avance merci.
Voilà il se trouve que j'ai un peu de temps à tuer donc j'ai décidé d'apprendre le CSS.
Mon problème :
Je définie, par exemple une classe : .bouton { background-color:red; }
- Comment faire pour définir une autre sous-classe (enfant de .bouton !) qui hérite des propriétés de .bouton. Un truc genre : .bouton.actif { color:yellow }
?
- Et comment appeler ou appliquer .actif à un <span> par exemple
(pour avoir au final un texte jaune sur fond rouge)
?
D'avance merci.
7 réponses
-
Salut.
Il suffit de mettre les différentes classes à utiliser dans l'attribut class, en les séparant par un espace.
Les propriétés des classes utilises se fusionneront.
Par exemple :<span class="gras italique">Salut</span> .gras { font-weight: bold; } .italique { font-style: italic; }
Ton ordinateur ne fait pas ce que tu veux ... mais ce que tu lui dis de faire. -
Ok ça marche merci pour ta réponse avion-f16
mais j'ai déjà lu quelque part qu'on pouvait faire des trucs comme :
.gras .italique {...}
mais bien-sur je n'ai pas tout capté !
et si cette syntaxe est exacte comment peut-on appliquer .italique à un <span> par exemple ?
A vous, merci... -
Ça permet de styler la classe "italique" uniquement dans un élément ayant la classe "gras".
Par exemple :<p class="gras"> Je suis en gras<br/> <span class="italique">Je suis en gras et italique</span> </p> Je suis en rien <span class="italique">Je suis en rien</span> -
OK c'est clair merci encore.
Donc si j'ai bien compris, pas moins de faire directement par exemple :
<p class="gras italique">...</p>
ou :
<p class="gras" class="italique">...</p>
? -
Le premier code est correcte, les propriétés des classes "gras" et "italique" fuisonneront. Mais ça ne sera pas
.gras .italique { ... }mais.gras { ... } .italique { ... } -
Salut,
Oui, je comprends ! Pour résumer :.gras .italique { ... }
veut dire que .italique ne s'applique que sur les objets ayant le style .gras c'est bien ça non ?
Je trouve juste, un peu bizarre qu'on soit obligé de faire :<span class="gras"> <span class="italique">Un texte</span> </span>
donc un span dans un span ! pour "appeler" .italique !
Un petit commentaire peut etre... ? merci encore -
Salut,
OK ça marche je fais comme ça moi aussi
@+
Merci ;)
