هل هناك طريقة لاختيار العنصر الأخير في القائمة باستخدام CSS؟

Question

لنفترض أن لدي قائمة على النحو التالي:

• البند 1
• البند2
• البند3

هل يوجد محدد CSS يسمح لي بتحديد العنصر الأخير في القائمة مباشرة؟في هذه الحالة البند 3.

هتافات!

Answer 1

ليس هذا ما اخاف منه.الحل التقليدي هو وضع علامة على العنصرين الأول والأخير باستخدام class = "first" & class = "last" حتى تتمكن من التعرف عليهما.

فئة CSS psudo الطفل الأول سوف تحصل على العنصر الأول ولكن ليس كل المتصفحات تدعمه.سوف يكون CSS3 الطفل الأخير أيضًا (هذا مدعوم حاليًا بواسطة Firefox وSafari ولكن ليس IE 6/7/beta 8)

Answer 2

وإلى أن يتم دعمه بشكل صحيح، ستحتاج إلى إضافة فئة إلى العناصر "الأخيرة"، كما هو مقترح.لكن ليس عليك القيام بذلك يدويًا.إذا كان بإمكانك الحصول على نتيجة جافا سكريبت، فقم بإلقاء نظرة على إما:

• مسج: محدد الطفل الأخير
• إبقاء أطفال عناصرك متماشين مع النسل (مقال منفصل بقلم Alex Bischoff)، وهي طريقة محددة وخفيفة الوزن

سيؤدي أي منهما إلى تجنب "تلويث" ترميزك، ويكون مقبولًا تمامًا إذا كان أسلوبك "إضافة لطيفة" بدلاً من ميزة التصميم "التي يجب توفرها".

Answer 3

يجب تحديث الإجابة على هذا السؤال!IE9 + Firefox (منذ فترة) + Chrome وSafari كل الدعم: last-of-type أو last-child