პსევდოკლასი 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 - ეს
იქნება ყოველი მესამე ელემენტი (მესამედან დაწყებული), და ასე შემდეგ.
|
მაგალითი
ამ მაგალითში ჩვენ გავაწითლებთ
იმ li-ს, რომელიც არის 4-ური ბოლოდან
შვილი თავისი მშობლისა:
<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;
}
: