Manuel de compositeurs CSS

Combinateurs CSS

Un combinateur est un symbole utilisé pour expliquer les relations entre les sélecteurs.

Le tableau suivant montre les différents combinateurs dans CSS :

Nom Symbole Exemple Description de l'exemple
Combinateur de descendants directs > div > p Sélectionnez tous les éléments <p> qui sont des éléments enfants directs de l'élément <div>.
Combinateur de descendants (espace unique) div p Sélectionnez tous les éléments <p> à l'intérieur de l'élément <div>.
Séparateur d'espace de nom | ns | h2 Sélectionnez tous les éléments <h2> dans l'espace de nom ns.
Combinateur d'adjacence + div + p Sélectionnez le premier élément <p> immédiatement après l'élément <div>.
Liste des sélecteurs , div, p Sélectionner tous les éléments <div> et tous les éléments <p>.
Combinateur frère suivant ~ p ~ ul Sélectionner tous les éléments <ul> précédés d'un élément <p>.