تقنية

عبارة of في nth-child: هل نعد كل الأبناء أم العناصر المطابقة؟

ثلاثة أبناء؛ note في الأول والثالث، والثالث ثاني المطابقين.
ترتيب مؤلف، لا بيانات صفحة خارجية.

الثاني يعتمد على ما نعده.

الخلاصة السريعة

:nth-child(2 of .note) يعد العناصر المطابقة للصنف، أما .note:nth-child(2) فيشترط أن يكون الابن الثاني نفسه مطابقًا.

  • عبارة of ترشح قائمة الأشقاء المعدودة.
  • عند غيابها، يدخل كل عنصر شقيق في العد.
  • وضع الصنف خارج الدالة يغير الاختيار.
  • في مثالنا، الثاني المطابق هو الابن الثالث.

ثلاثة أبناء

رتبنا عناصر الأشقاء: p.note، ثم div بلا صنف، ثم p.note. قائمة .note تضم الأول والثالث؛ لذلك :nth-child(2 of .note) يختار الثالث. أما .note:nth-child(2) فلا يختار أحدًا: الابن الثاني ليس note.

حدد مجموعة العد

يبدأ الفهرس من 1. حدد المجموعة قبل تفسير الرقم؛ نقل الشرط خارج الدالة يغير السلوك.

المصادر ومتابعة القراءة

  1. W3C — Selectors، القسم 13.3.1 (يفتح في نافذة جديدة)w3.org

أُعدّ هذا المقال بصياغة عربية أصلية بالاستناد إلى المصادر أعلاه، وهو مدخل تمهيدي إلى الموضوع. اقرأ منهجية المحتوى وحدوده.