Psevdo razred nth-last-child

Psevdo razred nth-last-child izbere element, ki je n-ti podrejeni element starša, štetje od konca. Obnaša se podobno kot nth-child, vendar se štetje izvaja od konca.

Sintaksa

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

Vrednosti

Vrednost	Opis
število	Pozitivno število začenši z `1`. Določa zaporedno številko elementa, do katerega želimo dostopati. Številčenje elementov se začne z `1`.
`odd`	Lihi elementi.
`even`	Sodi elementi.
izraz	Lahko sestavite posebne izraze s črko n, ki predstavlja vsa cela števila od nič (ne od ena) do neskončnosti. Tako `2n` pomeni vsa soda števila (z drugim vključno). Kako to razumeti? V `n` zaporedoma zamenjujte števila od `0` naprej: če je n = 0, potem 2n da 0 - takega elementa ni (številčenje elementov se začne z 1), če je n = 1, potem 2n da 2 - drugi element, če je n = 2, 2n da 4 - četrti element. Če napišete 3n - to pomeni vsak tretji element (z tretjim vključno), in tako naprej.

Primer

V tem primeru bomo obarvali rdeče tisti li, ki je 4.-ti od konca podrejeni element svojega starša:

<ul>
	<li>element seznama</li>
	<li>element seznama</li>
	<li>element seznama</li>
	<li>element seznama</li>
	<li>element seznama</li>
</ul>

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

Primer

Zdaj bomo obarvali rdeče vse sode od konca li elemente:

<ul>
	<li>element seznama</li>
	<li>element seznama</li>
	<li>element seznama</li>
	<li>element seznama</li>
	<li>element seznama</li>
</ul>

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

Primer

Zdaj bomo obarvali rdeče vse lihe od konca li elemente:

<ul>
	<li>element seznama</li>
	<li>element seznama</li>
	<li>element seznama</li>
	<li>element seznama</li>
	<li>element seznama</li>
</ul>

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

Primer

Zdaj bomo obarvali rdeče vsak tretji od konca li element:

<ul>
	<li>element seznama</li>
	<li>element seznama</li>
	<li>element seznama</li>
	<li>element seznama</li>
	<li>element seznama</li>
</ul>

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