Псевдокласс nth-last-child
Псевдокласс nth-last-child
родидан oxирига қараб ҳисобланган n-чи
фарзанд элементни танлайди. nth-child
каби ҳаракат қилади, фақат ҳисоб oxиридан бошланади.
Синтаксис
селектор:nth-last-child(сон | 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 деб ёзилса - бу
ҳар учинчи элемент (учинчидан бошлаб), ва ҳоказо.
|
Мисол
Бу мисолда биз li ни қизил рангга киритамиз,
яъни унинг родидан oxирига қараб 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;
}
:
Мисол
Ҳозир биз oxиридан ҳисобланган барча
жуфт 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;
}
:
Мисол
Ҳозир биз oxиридан ҳисобланган барча тоқ
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;
}
:
Мисол
Ҳозир биз oxиридан ҳисобланган ҳар учинчи
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;
}
: