Псевдокласот nth-last-child

Псевдокласот nth-last-child избира елемент кој е n-ти потомок на родителот, броејќи од крај. Се однесува слично на nth-child, само што броењето е од крај.

Синтакса

селектор:nth-last-child(број | odd | even | израз) {
	
}

Вредности

Вредност	Опис
број	Позитивен број почнувајќи од `1`. Го одредува бројот на елементот до кој сакаме да пристапиме. Броењето на елементите почнува од `1`.
`odd`	Непарни елементи.
`even`	Парни елементи.
израз	Може да се состават специјални изрази со буквата n, која ги означува сите цели броеви од нула (не од единица) до бесконечност. Така, `2n` - значи сите парни броеви (почнувајќи од вториот). Како да се разбере ова? Заменуваме во `n` последователно броеви од `0` и така натаму: ако n = 0, тогаш 2n ќе даде 0 - таков елемент не постои (броењето на елементите е од 1), ако n = 1, тогаш 2n ќе даде 2 - вториот елемент, ако n = 2, 2n дава 4 - четвртиот елемент. Ако се напише 3n - ова ќе биде секој трет елемент (почнувајќи од третиот), и така натаму.

Пример

Во овој пример ќе го направиме црвена боја оној li кој е 4-ти од крај потомок на својот родител:

<ul>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ul>

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

Пример

Сега црвени ќе ги направиме сите парни од крај li:

<ul>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ul>

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

Пример

Сега црвени ќе ги направиме сите непарни од крај li:

<ul>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ul>

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

Пример

Сега црвени ќе ги направиме секоја трета од крај li:

<ul>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
	<li>list item</li>
</ul>

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