Cette page a été traduite à partir de l'anglais par la communauté. Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.
Combinateur de voisins directs
Baseline
Widely available
Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis juillet 2015.
Le combinateur de voisin direct (+) sépare deux sélecteurs et ne fait correspondre le second élément que s'il suit immédiatement le premier élément, et si les deux sont des enfants du même élément parent.
css
/* Ne cible que les paragraphes situés directement après une image */
img + p {
font-style: bold;
}
Syntaxe
css
/* L'espace blanc autour du combinateur + est facultatif mais recommandé. */
premier_element + second_element { propriétés de style }
Exemples
CSS
css
li:first-of-type + li {
color: red;
}
HTML
html
<ul>
<li>Un</li>
<li>Deux</li>
<li>Trois</li>
</ul>
Résultat
[フレーム]
Spécifications
| Specification |
|---|
| Selectors Level 4 # adjacent-sibling-combinators |
Compatibilité des navigateurs
Chargement...