Псевдокласс nth-last-of-type
Псевдокласс nth-last-of-type
родиданги берилган турдаги натиралар ичидан
охиридан хисоблаб n-чи натирани танлайди.
nth-of-type
каби ишлейди, факат охиридан хисоблайди.
Синтаксис
селектор:nth-last-of-type(сон | odd | even | ифода) {
}
Қийматлар
| Қиймат | Изох |
|---|---|
| сон |
1 дан бошланадиган мусбат сон.
Узга мурожаат килмоқчи бўлган элементнинг
рақамини белгилайди. Элементларнинг рақамлаши 1 дан бошланади.
|
odd |
Тоқ рақамли элементлар. |
even |
Жуфт рақамли элементлар. |
| ифода |
Ҳарф билан махсус ифодалар тузиш мумкин,
бу n нолдан (бирликдан эмас)
босҳлаб чексизликкача бўлган барча бутун сонларни билдиради.
Шу тариқа, 2n - демак барча жуфт рақамлар
(иккинчидан бошлаб).
Буни қандай тушуниш керак? n га босқичма-босқич
0 ва ҳоказо сонларни қўйамиз: агар n = 0 бўлса, 2n 0 ни берadi -
бундай элемент йўқ (элементларнинг рақамлаши 1 дан бошланади),
агар n = 1 бўлса, 2n 2 ни беради - иккинчи элемент, агар n = 2 бўлса,
2n 4 ни беради - тўртинчи элемент. Агар 3n деб ёзилса - бу
ҳар учинчи элемент (учинчидан бошлаб), ва ҳоказо.
|
Мисол
Охиридан хисоблаб, родидаги 2-чи h2
ни топамиз:
<div>
<h2>сарлавҳа</h2>
<p>абзац</p>
<h2>сарлавҳа</h2>
<p>абзац</p>
<h2>сарлавҳа</h2>
<p>абзац</p>
<h2>сарлавҳа</h2>
<p>абзац</p>
<h2>сарлавҳа</h2>
<p>абзац</p>
<h2>сарлавҳа</h2>
<p>абзац</p>
<h2>сарлавҳа</h2>
<p>абзац</p>
</div>
h2:nth-last-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>
<h2>сарлавҳа</h2>
<p>абзац</p>
<h2>сарлавҳа</h2>
<p>абзац</p>
</div>
h2:nth-last-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>
<h2>сарлавҳа</h2>
<p>абзац</p>
<h2>сарлавҳа</h2>
<p>абзац</p>
</div>
h2:nth-last-of-type(odd) {
color: red;
}
: