Pseudoklass nth-last-of-type

Pseudoklass nth-last-of-type valib elemendi, mis on n-es tüüpi vanema n-es järglane, loendades lõpust. Käitub sarnaselt nth-of-type-ile, kuid loendamine toimub lõpust.

Süntaks

selektor:nth-last-of-type(number | odd | even | avaldis) {
	
}

Väärtused

Väärtus	Kirjeldus
number	Positiivne number alates `1`. Määrab elemendi numbri, millele me tahame viidata. Elementide numeratsioon algab `1`-st.
`odd`	Paaritud elemendid.
`even`	Paaris elemendid.
avaldis	Saab koostada spetsiaalseid avaldisi tähega n, mis tähistab kõiki täisarve nullist (mitte ühest) lõpmatuseni. Seega `2n` - tähendab kõiki paaris arve (alates teisest). Kuidas seda mõista? Asendame `n`-s järjestikku arvud alates `0` ja nii edasi: kui n = 0, siis 2n annab 0 - sellist elementi pole (elementide numeratsioon on 1-st), kui n = 1, siis 2n annab 2 - teine element, kui n = 2, 2n annab 4 - neljas element. Kui kirjutada 3n - see on iga kolmas element (alates kolmandast), ja nii edasi.

Näide

Leiame h2, mis on 2-nes h2 vanemas lõpust:

<div>
	<h2>pealkiri</h2>
	<p>lõik</p>
	
	<h2>pealkiri</h2>
	<p>lõik</p>
	
	<h2>pealkiri</h2>
	<p>lõik</p>
	
	<h2>pealkiri</h2>
	<p>lõik</p>
	
	<h2>pealkiri</h2>
	<p>lõik</p>
	
	<h2>pealkiri</h2>
	<p>lõik</p>
	
	<h2>pealkiri</h2>
	<p>lõik</p>
</div>

h2:nth-last-of-type(2) {
	color: red;
}

Näide

Leiame kõik paaris h2-d lõpust:

<div>
	<h2>pealkiri</h2>
	<p>lõik</p>
	
	<h2>pealkiri</h2>
	<p>lõik</p>
	
	<h2>pealkiri</h2>
	<p>lõik</p>
	
	<h2>pealkiri</h2>
	<p>lõik</p>
	
	<h2>pealkiri</h2>
	<p>lõik</p>
	
	<h2>pealkiri</h2>
	<p>lõik</p>
	
	<h2>pealkiri</h2>
	<p>lõik</p>
</div>

h2:nth-last-of-type(even) {
	color: red;
}

Näide

Leiame kõik paaritud h2-d lõpust:

<div>
	<h2>pealkiri</h2>
	<p>lõik</p>
	
	<h2>pealkiri</h2>
	<p>lõik</p>
	
	<h2>pealkiri</h2>
	<p>lõik</p>
	
	<h2>pealkiri</h2>
	<p>lõik</p>
	
	<h2>pealkiri</h2>
	<p>lõik</p>
	
	<h2>pealkiri</h2>
	<p>lõik</p>
	
	<h2>pealkiri</h2>
	<p>lõik</p>
</div>

h2:nth-last-of-type(odd) {
	color: red;
}