Psevdo-sinf nth-last-of-type
Psevdo-sinf nth-last-of-type
ota-ona berilgan turdagi n-ota avlodni
tanlaydi, oxiridan hisoblab. nth-of-type
ga o'xshash ishlaydi, faqat hisob oxiridan boshlanadi.
Sintaksis
selector:nth-last-of-type(son | odd | even | ifoda) {
}
Qiymatlar
| Qiymat | Tavsif |
|---|---|
| son |
1 dan boshlanadigan musbat son.
Murojaat qilmoqchi bo'lgan elementning
raqamini belgilaydi. Elementlarning raqamlash 1 dan boshlanadi.
|
odd |
Toq elementlar. |
even |
Juft elementlar. |
| ifoda |
n harfi yordamida maxsus ifodalar tuzish mumkin,
bu nol (birdan emas) dan cheksizlikkacha bo'lgan
barcha butun sonlarni bildiradi. Shunday qilib, 2n - barcha juft
sonlarni anglatadi (ikkinchisidan boshlab).
Buni qanday tushunish kerak? n ga ketma-ket
0 va hokazo sonlarni qo'yamiz: agar n = 0 bo'lsa, 2n 0 ni beradi -
bunday element mavjud emas (elementlarning raqamlashi 1 dan boshlanadi),
agar n = 1 bo'lsa, 2n 2 ni beradi - ikkinchi element, agar n = 2 bo'lsa,
2n 4 ni beradi - to'rtinchi element. Agar 3n yozilsa - bu
har uchinchi elementni anglatadi (uchinchisidan boshlab), va hokazo.
|
Misol
Oxiridan boshlab, ota-ona ichidagi 2-h2
h2 ni topamiz:
<div>
<h2>sarlavha</h2>
<p>abzas</p>
<h2>sarlavha</h2>
<p>abzas</p>
<h2>sarlavha</h2>
<p>abzas</p>
<h2>sarlavha</h2>
<p>abzas</p>
<h2>sarlavha</h2>
<p>abzas</p>
<h2>sarlavha</h2>
<p>abzas</p>
<h2>sarlavha</h2>
<p>abzas</p>
</div>
h2:nth-last-of-type(2) {
color: red;
}
:
Misol
Oxiridan boshlab barcha juft h2 larni topamiz:
<div>
<h2>sarlavha</h2>
<p>abzas</p>
<h2>sarlavha</h2>
<p>abzas</p>
<h2>sarlavha</h2>
<p>abzas</p>
<h2>sarlavha</h2>
<p>abzas</p>
<h2>sarlavha</h2>
<p>abzas</p>
<h2>sarlavha</h2>
<p>abzas</p>
<h2>sarlavha</h2>
<p>abzas</p>
</div>
h2:nth-last-of-type(even) {
color: red;
}
:
Misol
Oxiridan boshlab barcha toq h2 larni topamiz:
<div>
<h2>sarlavha</h2>
<p>abzas</p>
<h2>sarlavha</h2>
<p>abzas</p>
<h2>sarlavha</h2>
<p>abzas</p>
<h2>sarlavha</h2>
<p>abzas</p>
<h2>sarlavha</h2>
<p>abzas</p>
<h2>sarlavha</h2>
<p>abzas</p>
<h2>sarlavha</h2>
<p>abzas</p>
</div>
h2:nth-last-of-type(odd) {
color: red;
}
:
