:nth-last-of-type()


Misol

Oxiridan sanaganda ota elementining ikkinchi <p> elementi bo‘lgan har bir <p> elementi uchun fon rangini belgilang. Shuningdek, oxiridan sanaganda ota elementining uchinchi <li> elementi bo‘lgan har bir <li> elementi uchun ham fon rangini belgilang:

p:nth-last-of-type(2) {   background: red; } li:nth-last-of-type(3) { background: yellow; }
O‘zingiz sinab ko‘ring »

Quyida ko‘proq "O‘zingiz sinab ko‘ring" misollari keltirilgan.


Ta’rif va qo‘llanilishi

CSS :nth-last-of-type(n) psevdo-klassi oxirgi boladan boshlab sanaganda ota elementining muayyan turdagi n-bolasi bo‘lgan har bir elementga mos keladi.

n son/indeks, kalit so‘z (odd yoki even) yoki formula (masalan, an + b) bo‘lishi mumkin.

Maslahat: Oxirgi boladan boshlab sanaganda, turidan qat’i nazar, ota elementining n-bolasi bo‘lgan elementni tanlash uchun :nth-last-child() psevdo-klassiga qarang.

Versiya: CSS3

Brauzerlarda qo‘llab-quvvatlash

Jadvaldagi sonlar psevdo-klassni to‘liq qo‘llab-quvvatlaydigan birinchi brauzer versiyasini ko‘rsatadi.

Psevdo-klass
:nth-last-of-type() 4.0 9.0 3.5 3.2 9.6

CSS sintaksisi

:nth-last-of-type(index | odd | even | an+b) {
  css declarations;
} Demo


Ko‘proq misollar

Misol

Odd va even — indeksi toq yoki juft bo‘lgan bola elementlarni moslashtirish uchun ishlatiladigan kalit so‘zlar (birinchi bolaning indeksi 1 ga teng).

Bu yerda toq va juft p elementlari uchun ikki xil fon rangini belgilaymiz:

p:nth-last-of-type(odd) {   background: red; } p:nth-last-of-type(even) {   background: blue; }
O‘zingiz sinab ko‘ring »

Misol

Formuladan foydalanish (an + b). Tavsif: a butun sonli qadam o‘lchamini ifodalaydi, n — 0 dan boshlab barcha manfiy bo‘lmagan butun sonlar, b esa butun sonli siljish qiymati.

Bu yerda oxiridan sanaganda indeksi 3 ga karrali bo‘lgan barcha <p> va <li> elementlari uchun fon rangini belgilaymiz:

p:nth-last-of-type(3n) {   background: red; } li:nth-last-of-type(3n) {   background: yellow; }
O‘zingiz sinab ko‘ring »


W3Schools Pathfinder

Yutuqlaringizni kuzating – bu bepul!