:last-childSelektor omogućuje ciljanje posljednji element izravno unutar svojih sadrži element. U specifikaciji CSS Selectors Level 3 definiran je kao „strukturna pseudo-klasa“, što znači da se koristi za oblikovanje sadržaja na temelju odnosa s roditeljskim sadržajem i sadržajem.
Pretpostavimo da imamo članak i želimo smanjiti posljednji odlomak kako bismo zaključili sadržaj (poput bilješke urednika):
Lorem ipsum…
Dolor sit amet…
Consectetur adipisicing…
Last paragraph…
Umjesto da koristimo klasu (npr. .last), Možemo je koristiti :last-childza odabir:
p:last-child ( font-size: 0.75em; )Korištenje :last-childje vrlo slično, :last-of-typeali s jednom kritičnom razlikom: manje je specifično. :last-childpokušat će podudariti samo posljednje dijete roditeljskog elementa, dok last-of-typeće se podudarati s posljednjim pojavljivanjem određenog elementa, čak i ako u HTML-u ne postane zadnji. U gornjem primjeru ishod bi bio isti, samo zato što je posljednje dijete articletakođer zadnji pelement. To otkriva moć :last-child: može prepoznati element u odnosu na svu svoju braću i sestre, a ne samo na braću i sestre iste vrste.
Što više kompletan primjer u nastavku pokazuje uporabu :last-childi srodne selektor pseudo-klase, :first-child.
Podrška preglednika
| Krom | Safari | Firefox | Opera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| Bilo koji | 3,2+ | Bilo koji | 9,5+ | 9+ | Bilo koji | Bilo koji |
:last-childuveden je u CSS Selectors Module 3, što znači da ga stare verzije preglednika ne podržavaju. Međutim, moderna podrška za preglednike je besprijekorna, a novi pseudo-selektori široko se koriste u proizvodnim okruženjima. Ako vam je potrebna starija podrška za preglednik, ili polifil za IE, ili ove selektore koristite na nekritične načine, progresivno poboljšanje, što se preporučuje.