Sélecteurs de relation dans l'imbrication LESS
Voyons comment ajouter différents sélecteurs qui ciblent les éléments par relation dans l'imbrication LESS. Voir les exemples.
Exemple
Sélecteur enfant direct :
div {
> p {
color: red;
}
}
Résultat de la compilation :
div > p {
}
Exemple
Sélecteur adjacent
div {
+ p {
color: red;
}
}
Résultat de la compilation :
div + p {
}
Exemple
Sélecteur de frères généraux :
div {
~ p {
color: red;
}
}
Résultat de la compilation :
div ~ p {
}
Tâches pratiques
Expliquez quel sera le résultat de la compilation du code suivant :
ul {
color: red;
> li {
padding: 20px;
}
}
Expliquez quel sera le résultat de la compilation du code suivant :
div {
ul {
> li {
padding: 20px;
}
}
}