Pseudo-klasa nth-last-child

Pseudo-klasa nth-last-child bira element koji je n-to potomak svog roditelja, brojeći od kraja. Ponaša se analogno nth-child, samo što se brojanje vrši od kraja.

Sintaksa

selektor:nth-last-child(broj | odd | even | izraz) {
	
}

Vrednosti

Vrednost	Opis
broj	Pozitivan ceo broj počev od `1`. Određuje redni broj elementa kome želimo da pristupimo. Numeracija elemenata počinje od `1`.
`odd`	Neparni elementi.
`even`	Parni elementi.
izraz	Moguće je sastaviti posebne izraze sa slovom n, koje označava sve cele brojeve od nule (ne od jedinice) do beskonačnosti. Tako, `2n` znači sve parne brojeve (počev od drugog). Kako ovo razumeti? Zamenjujemo `n` uzastopno brojevima od `0` pa nadalje: ako je n = 0, onda 2n daje 0 - takav element ne postoji (numeracija elemenata je od 1), ako je n = 1, onda 2n daje 2 - drugi element, ako je n = 2, 2n daje 4 - četvrti element. Ako napišemo 3n - to će biti svaki treći element (počev od trećeg), i tako dalje.

Primer

U ovom primeru ćemo crvene boje učiniti onaj li element koji je 4-ti od kraja potomak svog roditelja:

<ul>
	<li>stavka liste</li>
	<li>stavka liste</li>
	<li>stavka liste</li>
	<li>stavka liste</li>
	<li>stavka liste</li>
</ul>

li:nth-last-child(4) {
	color: red;
}

Primer

Sada ćemo crvenim učiniti sve parne od kraja li elemente:

<ul>
	<li>stavka liste</li>
	<li>stavka liste</li>
	<li>stavka liste</li>
	<li>stavka liste</li>
	<li>stavka liste</li>
</ul>

li:nth-last-child(even) {
	color: red;
}

Primer

Sada ćemo crvenim učiniti sve neparne od kraja li elemente:

<ul>
	<li>stavka liste</li>
	<li>stavka liste</li>
	<li>stavka liste</li>
	<li>stavka liste</li>
	<li>stavka liste</li>
</ul>

li:nth-last-child(odd) {
	color: red;
}

Primer

Sada ćemo crvenim učiniti svaki treći od kraja li element:

<ul>
	<li>stavka liste</li>
	<li>stavka liste</li>
	<li>stavka liste</li>
	<li>stavka liste</li>
	<li>stavka liste</li>
</ul>

li:nth-last-child(3n) {
	color: red;
}