Псевдокласси nth-of-type

Псевдокласси nth-of-type унсуреро интихоб мекунад, ки н-уми фарзанди навъи муайян аст.

Яъне, агар ман h2:nth-of-type(4) нависам - 4-уми h2 дар волидайн пайдо мешавад (фарқият бо nth-child, ки фақат он h2-ро меёбад, ки 4-уми унсур дар волидайн аст).

Синтаксис

интихобкунанда:nth-of-type(адад | odd | even | ибора){

}

Қиматҳо

Қимат	Тавсиф
адад	Адади мусбат аз `1` сар карда. Рақами унсурро муайян мекунад, ба он ки мо муроҷиат кардан мехоҳем. Рақамгузории унсурҳо аз `1` оғоз мешавад.
`odd`	Унсурҳои тоқ.
`even`	Унсурҳои ҷуфт.
ибора	Мумкин аст ибораҳои вижа бо ҳарфи n сохта шаванд, ки ҳамаи ададҳои бутунро аз сифр (на аз як) то номуайянӣ ифода мекунад. Пас, `2n` - маънои ҳамаи ададҳои ҷуфт (аз дуввумӣ оғоз карда). Инро чӣ гуна фаҳмидан мумкин? Дар `n` пайдарпай ададҳоро аз `0` ва ғайра иваз мекунем: агар n = 0 бошад, пас 2n 0 медиҳад - чунин унсур вуҷуд надорад (рақамгузории унсурҳо аз 1), агар n = 1 бошад, пас 2n 2 медиҳад - унсури дуюм, агар n = 2 бошад, 2n 4 медиҳад - унсури чорум. Агар 3n нависед - ин ҳар унсури сеюм хоҳад буд (аз сеюм оғоз карда), ва ғайра.

Намуна

h2-еро меёбем, ки 2-юми h2 дар волидайн аст:

<div>
	<h2>унвон</h2>
	<p>абзац</p>
	
	<h2>унвон</h2>
	<p>абзац</p>
	
	<h2>унвон</h2>
	<p>абзац</p>
</div>

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

Намуна

Ҳамаи h2-ҳои ҷуфтро меёбем:

<div>
	<h2>унвон</h2>
	<p>абзац</p>
	
	<h2>унвон</h2>
	<p>абзац</p>
	
	<h2>унвон</h2>
	<p>абзац</p>
	
	<h2>унвон</h2>
	<p>абзац</p>
	
	<h2>унвон</h2>
	<p>абзац</p>
</div>

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

Намуна

Ҳамаи h2-ҳои тоқро меёбем:

<div>
	<h2>унвон</h2>
	<p>абзац</p>
	
	<h2>унвон</h2>
	<p>абзац</p>
	
	<h2>унвон</h2>
	<p>абзац</p>
	
	<h2>унвон</h2>
	<p>абзац</p>
	
	<h2>унвон</h2>
	<p>абзац</p>
</div>

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