Combinateurs CSS

Combinateurs CSS
Un combinateur est quelque chose qui explique la relation entre les sélecteurs.
Un sélecteur CSS peut contenir plusieurs sélecteurs simples. Entre les sélecteurs simples, on peut inclure un combinateur.
Il existe quatre combinateurs différents en CSS :
- sélecteur descendant (espace)
- sélecteur enfant (>)
- sélecteur frère adjacent (+)
- sélecteur général frère (~)
Sélecteur descendant
Le sélecteur descendant correspond à tous les éléments descendants d’un élément spécifié.
L’exemple suivant sélectionne tous les éléments
à l’intérieur des éléments
Sélecteur enfant (>)
Le sélecteur d’enfant sélectionne tous les éléments qui sont les enfants d’un élément spécifié.
L’exemple suivant sélectionne tous les éléments
qui sont des enfants d’un élément
Sélecteur de frères et sœurs adjacents (+)
Le sélecteur de frère adjacent est utilisé pour sélectionner un élément qui se trouve directement après un autre élément spécifique.
Les éléments frères doivent avoir le même élément parent, et “adjacent” signifie “immédiatement après”.
L’exemple suivant sélectionne le premier élément
placé immédiatement après les éléments
Sélecteur général de frères et sœurs (~)
Le sélecteur de frère général sélectionne tous les éléments qui sont les prochains frères d’un élément spécifié.
L’exemple suivant sélectionne tous les éléments
qui sont les frères et sœurs suivants des éléments
Tous les sélecteurs CSS Combinator
Sélecteur | Exemple | Exemple de description |
---|---|---|
élément élément | div p | Sélectionne tous les éléments
à l’intérieur des éléments |
élément>élément | div > p | Sélectionne tous les éléments
où le parent est un élément |
élément+élément | div + p | Sélectionne le premier élément
placé immédiatement après les éléments |
élément1~élément2 | p ~ ul | Sélectionne chaque élément
|
#Combinateurs #CSS