Combinateur de voisin direct

Cette forme de combinateur permet de sélectionner un élément uniquement si celui-ci « suit » un élément donné et que les deux éléments sont les fils d'un même élément parent.

/* Ne cible que les paragraphes situé directement après une image */
img + p {
  font-style: bold;
}

Syntaxe

premier_element + element_cible { styles }

Exemples

CSS

li:first-of-type + li {
  color: red;
}

HTML

<ul>
  <li>Un</li>
  <li>Deux</li>
  <li>Trois</li>
</ul>

Résultat

Spécifications

Spécification État Commentaires
Selectors Level 4
La définition de 'next-sibling combinator' dans cette spécification.
Version de travail Renomme ce sélecteur en « next-sibling combinator ».
Selectors Level 3
La définition de 'Adjacent sibling combinator' dans cette spécification.
Recommendation  
CSS Level 2 (Revision 1)
La définition de 'Adjacent sibling selectors' dans cette spécification.
Recommendation Définition initiale.

Compatibilité des navigateurs

BCD tables only load in the browser

Voir aussi