المزيج المزيف :nth-last-child() في CSS

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

CSS :nth-last-child(n) المزيج المزيف يستخدم للتوافق مع كل عنصر هو الطفل الآخر من النهاية كطفل للعنصر الأب، بغض النظر عن نوعه.

n يمكن أن يكون عددًا/فهرسًا، كلمة مفتاحية (odd أو even) أو صيغة (مثل an + b)

نصيحة:انظر :nth-last-of-type() المزيج المزيف يستخدم لاختيار كل عنصر هو الطفل الآخر من النهاية كطفل للعنصر الأب. n العناصر

مثال

مثال 1

حدد لون الخلفية للعناصر <p> التي تكون العنصر الثاني من النهاية كطفل للعنصر الأب.

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

جرب بنفسك

مثال 2

odd و even هو كلمة مفتاحية يمكن استخدامها للتوافق مع العناصر التي تكون صفيحة المعدل للرقم الآسي أو الصحيح.

في هذا السياق، نحن نحدد ألوان الخلفية المختلفة للعناصر <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(index | odd | even | an+b) {
  الجمل المكتوبة بالكود css;
}

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

دعم المتصفح

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