nth-last-child жалган-классы
nth-last-child жалган-классы
ата-энесинин аягынан эсептелген n-чи
уулу болгон элементти тандайт. nth-child
сыяктуу эле иштейт,
бирок эсептөө аягынан башталат.
Синтаксис
тандоочу:nth-last-child(сан | odd | even | туюнтма) {
}
Маанилер
| Маани | Сүрөттөө |
|---|---|
| сан |
1дон башталган оң сан.
кайрылгыбыз келген элементтин
номерин белгилейт. Элементтердин номери 1дон башталат.
|
odd |
Так эмес элементтер. |
even |
Так элементтер. |
| туюнтма |
Бардык бүтүн сандарды нөлдөн (бирден эмес)
чексиздикке чейин белгилөөчү n тамгасы менен
атайын туюнтмаларды түзсө болот. Ошентип, 2n - бардык так
сандарды (экинчиден баштап) билдирет.
Муну кантип түшүнүү керек? nга ырааттуу түрдө
0 жана андан ары сандарды коё беребиз: эгер n = 0 болсо, анда 2n 0 берет -
мындай элемент жок (элементтердин номери 1ден башталат),
эгер n = 1 болсо, анда 2n 2 берет - экинчи элемент, эгер n = 2 болсо,
2n 4 берет - төртүнчү элемент. Эгерде 3n жазсак - бул
ар бир үчүнчү элемент (үчүнчүдөн баштап) болот, жана ушу сыяктуу.
|
Мисал
Бул мисалда биз кызыл түстү
ата-энесинин аягынан эсептелген 4-чү
уулу болгон liге белебиз:
<ul>
<li>тизме элементи</li>
<li>тизме элементи</li>
<li>тизме элементи</li>
<li>тизме элементи</li>
<li>тизме элементи</li>
</ul>
li:nth-last-child(4) {
color: red;
}
:
Мисал
Азыр биз аягынан эсептелген бардык
так li элементтерин кызыл кылабыз:
<ul>
<li>тизме элементи</li>
<li>тизме элементи</li>
<li>тизме элементи</li>
<li>тизме элементи</li>
<li>тизме элементи</li>
</ul>
li:nth-last-child(even) {
color: red;
}
:
Мисал
Азыр биз аягынан эсептелген бардык так эмес
li элементтерин кызыл кылабыз:
<ul>
<li>тизме элементи</li>
<li>тизме элементи</li>
<li>тизме элементи</li>
<li>тизме элементи</li>
<li>тизме элементи</li>
</ul>
li:nth-last-child(odd) {
color: red;
}
:
Мисал
Азыр биз аягынан эсептелген ар бир үчүнчү
li элементтин кызыл кылабыз:
<ul>
<li>тизме элементи</li>
<li>тизме элементи</li>
<li>тизме элементи</li>
<li>тизме элементи</li>
<li>тизме элементи</li>
</ul>
li:nth-last-child(3n) {
color: red;
}
:
