Plusieurs sélecteurs combinés en CSS
Pour sélectionner un élément qui correspond simultanément à plusieurs sélecteurs, il faut écrire ces sélecteurs de manière contiguë, sans espace.
Par exemple, le sélecteur suivant choisira l'élément
ayant simultanément la classe bbb et la classe
zzz :
.bbb.zzz {
}
Et le sélecteur suivant choisira le titre h2,
ayant simultanément la classe bbb et la classe
zzz :
h2.bbb.zzz {
}
De cette manière, il est possible de construire des combinaisons de sélecteurs arbitraires. L'ordre des sélecteurs utilisés n'a pas d'importance, sauf pour la règle stipulant que les sélecteurs de balises doivent être placés tout au début.
C'est-à-dire, par exemple, que les sélecteurs .bbb.zzz
et .zzz.bbb sont totalement équivalents.
En outre, il est possible de former des sélecteurs en
utilisant un id, par exemple, comme ceux-ci :
#elem.eee, ou h2#elem.eee,
ou h2.eee#elem, et ainsi de suite.
Expliquez ce que le sélecteur sélectionne dans le code ci-dessous. Ensuite, écrivez le code HTML correspondant à ce sélecteur. Voici le code avec le sélecteur :
.bbb.zzz {
color: red;
}
Expliquez ce que le sélecteur sélectionne dans le code ci-dessous. Ensuite, écrivez le code HTML correspondant à ce sélecteur. Voici le code avec le sélecteur :
h2.bbb.zzz {
color: red;
}
Expliquez ce que le sélecteur sélectionne dans le code ci-dessous. Ensuite, écrivez le code HTML correspondant à ce sélecteur. Voici le code avec le sélecteur :
#elem.bbb {
color: red;
}
Expliquez ce que le sélecteur sélectionne dans le code ci-dessous. Ensuite, écrivez le code HTML correspondant à ce sélecteur. Voici le code avec le sélecteur :
#elem.bbb.zzz {
color: red;
}
Expliquez ce que le sélecteur sélectionne dans le code ci-dessous. Ensuite, écrivez le code HTML correspondant à ce sélecteur. Voici le code avec le sélecteur :
h2#elem.bbb {
color: red;
}
