Le combinateur d'adjacence en CSS permet d'effectuer une transition sur un élément voisin.
Il existe deux types de combinateurs adjacents: direct et indirect. Nous allons voir ici le combinateur adjacent direct.
Le combinateur adjacent direct
Pour mettre en place un combinateur adjacent direct, vous allez assigner à la pseudoclasse le signe + suivi du nom de l'élément voisin.
Reprenons l'exemple du tutoriel précédent sur les transitions en CSS, avec l'animation sur le bouton qui s'agrandissait.
Nous allons maintenant faire en sorte que le cercle situé à ses côtés s'agrandissent également au survol du bouton.
N'hésitez pas à faire des tests sur codepen pour bien comprendre le fonctionnement.
See the Pen
Le combinateur adjacent direct by anna (@cds-creation-de-site)
on CodePen.
