MDN’s new design is in Beta! A sneak peek: https://blog.mozilla.org/opendesign/mdns-new-design-beta/

La pseudo-classe :last-child permet de cibler un élément qui est le dernier enfant de son parent.

/* Cible n'importe quel élément <li> tant que    */
/* celui-ci est le dernier enfant de son élément */
/* parent */
li:last-child {
  background-color: lime;
}

Note : En CSS3, l'élément ciblé devait avoir un élément parent, cette restriction a été levée en CSS4.

Syntaxe

:last-child

Exemples

CSS

li:last-child {
  background-color: lime;
}

HTML

<ul>
   <li>Cet élément n'est pas vert !</li>
   <li>Celui-ci est vert.</li>
</ul>

Résultat

Spécifications

Spécification État Commentaires
Selectors Level 4
La définition de ':last-child' dans cette spécification.
Version de travail Il n'est plus obligatoire que l'élément ciblé ait un parent.
Selectors Level 3
La définition de ':last-child' dans cette spécification.
Recommendation Définition initiale.

Compatibilité des navigateurs

Fonctionnalité Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari
Support simple 1.0 (Oui) 1.0 (1.7 ou moins) 9.0 9.5 3.2
Pas d'élément parent nécessaire 57 ? 51 (51)[1] ? 44 ?
Fonctionnalité Webview Android Chrome pour Android Edge Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Support simple (Oui) (Oui) (Oui) 1.0 (1) 9.0 10 3.2
Pas d'élément parent nécessaire 57 57 51.0 (51)[1] ? ? 44 ?

[1] Cf. bug 1300374

Voir aussi

Étiquettes et contributeurs liés au document

Étiquettes : 
 Contributeurs à cette page : SphinxKnight, tregagnon, Fredchat, louuis, teoli, FredB, ThePrisoner, Vivelefrat
 Dernière mise à jour par : SphinxKnight,