اللاصق :nth-last-child() في CSS

التعريف والاستخدام

CSS :nth-last-child(n) اللاصق يُستخدم لاختيار كل عنصر هو العنصر العكسي nth كإحدى الأبناء للعنصر الأب، بغض النظر عن نوعه.

n يمكن أن يكون عددًا/مؤشرًا، كلمة رئيسية (غير زوجي أو زوجي)) أو معادلة (مثل an+ b))

نصيحة:انظر :nth-last-of-type() اللاصق يُستخدم لاختيار كل عنصر هو العنصر العكسي nth كإحدى الأبناء للعنصر الأب، بغض النظر عن نوعه. n عنصر

مثال

مثال 1

حدد لون الخلفية لكل عنصر <p> الذي يكون هو الثاني كإحدى الأبناء العكسيين للعنصر الأب:

p:nth-last-child(2) {
  background-color: red;
}

جرب بنفسك

مثال 2

غير زوجي و زوجي هو كلمة رئيسية يمكن استخدامها للتوافق مع العناصر التي تكون نسبها غير زوجية أو زوجية.

في هذا السياق، نحدد لون الخلفية لجميع عناصر <p> التي تكون نسبها غير زوجية أو زوجية:

p:nth-last-child(odd) {
  background-color: red;
}
p:nth-last-child(even) {
  background-color: blue;
}

جرب بنفسك

مثال 3

باستخدام المعادلة (an+ b))a يعني انحراف صحيح، n هو جميع الأرقام غير السلبية من البداية 0،b هو انحراف صحيح.

في هذا السياق، نحدد لون الخلفية لجميع عناصر <p> التي تكون نسبها مضاعف لـ 3:

p:nth-last-child(3n+0) {
  background-color: red;
}

جرب بنفسك

نحو الأسلوب CSS

:nth-last-child(النسب | غير زوجي | زوجي | an+b) {
  تعليمات css;
}

تفاصيل التقنية

دعم المتصفح

الرقم في الجدول يشير إلى إصدار المتصفح الأول الذي يدعم هذا اللاصق.