combinateur frère adjacent

Le combinateur frère adjacent permet de sélectionner un élément qui partage le même parent qu’un autre et qui se situe juste après ce dernier.

Le combinateur descendant adjacent consiste en un caractère plus + suivant le sélecteur de l’élément frère adjacent de celui que l’on souhaite sélectionner, et précédent l’élément que l’on souhaite sélectionner.

.sibling + .cible { /* on sélectionne tous les .cible qui ont un élément .sibling frère adjacent */ }

<div class="language-html highlighter-rouge">

<div class="parent">
  <div class="cible">non sélectionné</div>
  <div class="sibling">frère adjacent</div>
  <div class="cible">sélectionné</div>
  <div class="cible">non sélectionné</div>
</div>

<div class="parent">
  <div class="sibling">frère adjacent</div>
</div>
<div class="cible">non sélectionné</div>