6. المحددات الأساسية: المحدد العام (*)

المحددات (Selectors) هي محرك CSS؛ فهي تحدد بالضبط العناصر التي تنطبق عليها قاعدة معينة. نبدأ بأبسطها: المحدد العام.

المحدد العام (`*`)

تستهدف علامة النجمة (*) كل عنصر مفرد في مستند HTML.

html

العنوان

نص الفقرة

محتوى span

إذا قمنا بتطبيق هذا الـ CSS:

css

{ box-sizing: border-box; /* حالة استخدام شائعة */ margin: 0; padding: 0; }

تنطبق هذه القاعدة على body و header و h1 و p و div و span — حرفياً كل شيء.

حالة استخدام عملية: إعادة تعيين الافتراضيات (Resetting)

الاستخدام الأكثر تكراراً والموصى به للمحدد العام هو بالاشتراك مع تقنيات إعادة تعيين CSS الحديثة. غالباً ما تضع المتصفحات هوامش (margins) وحشوات (padding) افتراضية للعناصر (مثل body أو h1). غالباً ما يُستخدم المحدد العام لتصفير هذه القيم، مما يوفر بداية نظيفة:

css /* تحذير: استخدام * وحده للتنسيقات المعقدة عادة ما يكون غير فعال. لكن لإعادة التعيين، فهي ممارسة مقبولة. */

{ margin: 0; padding: 0; }

ملاحظة حول الأداء: رغم سهولته، كن حذراً عند استخدام * للتنسيقات المعقدة للغاية، لأن المتصفح يجب أن يقيم القاعدة لكل عنصر في الصفحة. في كثير من الحالات، من الأفضل استهداف عناصر محددة (مثل h1 و p) عند تطبيق أنماط جمالية.