العناصر الزائفة - Pseudo elements

العناصر الزائفة هي عناصر وهمية يمكنك إضافتها إلى وثيقة HTML الخاصة بك باستخدام CSS، دون الحاجة إلى تعديل كود HTML نفسه. تستخدم العناصر الزائفة بشكل شائع لإضافة محتوى أو تنسيق إلى عناصر موجودة دون تغيير محتوى HTML الأساسي.

المفاهيم الرئيسية:

• Before: يضيف محتوى أو تنسيق قبل العنصر.
• After: يضيف محتوى أو تنسيق بعد العنصر.
• First-letter: يضيف تنسيقًا إلى الحرف الأول من العنصر.
• First-line: يضيف تنسيقًا إلى السطر الأول من العنصر.

خطوات الاستخدام:

• حدد العنصر الذي تريد إضافة عنصر زائف إليه.
• استخدم اسم العنصر الزائف (مثل :before أو :after) لتحديد أنك تريد إضافة عنصر زائف.
• أضف المحتوى أو التنسيق الذي تريد إضافته إلى العنصر الزائف.

مثال على CSS لإضافة محتوى إلى عنصر دون تغيير HTML الأساسي:

p:before {
  content: "مقدمة: ";
}

هذا المثال سيضيف كلمة "مقدمة:" قبل كل عنصر <p> في الصفحة.

تحسين إمكانية الوصول وسهولة الاستخدام:

• استخدم العناصر الزائفة بحكمة، وتأكد من عدم إرباك المستخدمين أو إعاقتهم.
• استخدم العناصر الزائفة لتوفير معلومات إضافية أو تحسين التنقل، وليس لإخفاء المحتوى أو تغيير مظهر الصفحة بشكل كبير.
• تأكد من أن العناصر الزائفة متوافقة مع معايير إمكانية الوصول ومعايير سهولة الاستخدام، مثل WCAG 2.0.