CSS3 :nth-last-child()Sélecteurs
Manuel de référence complet des sélecteurs CSS
Exemple
Spécifiez la couleur d'arrière-plan pour chaque élément p qui est l'avant-dernier frère parmi les éléments du même type :
Essayez-le vous-même »
Définition et utilisation
Le sélecteur :nth-last-child(n) correspond à chaque élément qui est le N-ième enfant de son élément parent, quel que soit son type, en comptant à partir du dernier enfant.
nIl peut s'agir d'un nombre, d'un mot-clé ou d'une formule.
Astuce :Voir aussi :nth-last-of-type()Sélecteur. Ce sélecteur correspond à l'élément enfant structurel n-ième en partant de la fin à l'intérieur de l'élément parent.
Prise en charge des navigateurs
Les nombres dans le tableau indiquent le premier numéro de version du navigateur qui prend en charge la propriété.
| Sélecteurs | |||||
|---|---|---|---|---|---|
| :nth-last-child() | 4.0 | 9.0 | 3.5 | 3.2 | 9.6 |
Plus d’exemples
Exemple 1
Les mots-clés odd et even peuvent être utilisés pour correspondre aux éléments enfants dont l'index est impair ou pair.
Ici, nous spécifions deux couleurs d'arrière-plan différentes pour les éléments p impairs et pairs dans l'ordre inverse :
{
background:#ff0000;
}
p:nth-last-child(even)
{
background:#0000ff;
}
Essayez-le vous-même »
Exemple 2
Utilisation d'une formule (an + b). Description : a représente la taille d'un cycle, n est un compteur (commençant à 0), et b est un décalage.
Ici, nous spécifions une couleur d'arrière-plan pour tous les éléments p dont l'index, dans l'ordre inverse, est un multiple de 3 :
{
background:#ff0000;
}
Essayez-le vous-même »
autres extensions