شبه کلاس :nth-last-child() در CSS

تعریف و استفاده

CSS :nth-last-child(ن) شبه کلاس‌ها برای تطبیق هر عنصر که به عنوان ن‌مین فرزند پدر خود محاسبه می‌شود، استفاده می‌شوند، بدون در نظر گرفتن نوع آن.

ن می‌تواند یک عدد/شمارنده باشد، یک کلمه کلیدی (مانندغیرعددی یا عددی) یا یک فرمول (مانند ان+ ب)

نکته:ببینید :nth-last-of-type() شبه کلاس‌ها برای انتخاب هر عنصر که به عنوان ن‌مین فرزند پدر خود محاسبه می‌شود، استفاده می‌شوند، بدون در نظر گرفتن نوع آن. ن عنصر فرزند.

مثال

مثال 1

رنگ پس‌زمینه برای هر عنصر <p> که به عنوان دومین فرزند پدر خود محاسبه می‌شود، مشخص می‌کنیم:

p:nth-last-child(2) {
  background-color: قرمز;
}

آزمایش کنید

مثال 2

غیرعددی و عددی است یک کلمه کلیدی که می‌توان از آن برای تطبیق عناصر فرزند با شماره شماره‌گذاری غیرعددی و عددی استفاده کرد.

در اینجا، ما رنگ پس‌زمینه برای عناصر <p> که شماره شماره‌گذاری غیرعددی و عددی است را مشخص می‌کنیم:

p:nth-last-child(odd) {
  background-color: قرمز;
}
p:nth-last-child(even) {
  background-color: آبی;
}

آزمایش کنید

مثال 3

از فرمول (ان+ بتوضیح:ا نشان‌دهنده یک انحراف عددی است، n از 0 شروع می‌شود و شامل همه اعداد غیر منفی است،ب است انحراف عددی.

در اینجا، ما رنگ پس‌زمینه برای همه عناصر <p> که شماره شماره‌گذاری به صورت 3 چندگانگی است را مشخص می‌کنیم:

p:nth-last-child(3n+0) {
  background-color: قرمز;
}

آزمایش کنید

نحوه نوشتن CSS

:nth-last-child(شماره | غیرعددی | عددی | ان+ب) {
  اظلاعات css;
}

جزئیات فنی

نسخه: CSS3

پشتیبانی مرورگر

اعداد در جدول نسخه اولین مرورگر پشتیبان از این شبه کلاس را مشخص می‌کنند.

کروم ایج فایرفاکس سافاری آپرا
4.0 9.0 3.5 3.2 9.6