إعادة تعيين CSS

يسمى الملف الذي يحتوى على أنماط إعادة التعيين بـ CSS Reset file

ما هي أنماط إعادة التعيين؟ وما الحاجة إليها؟

كل صفحة ويب تحتوي على الأقل على ملف أنماط واحد، حتى لو لم تقم بربط أي ملف في صفحة الويب، كل متصفح لديه ملف أنماط إفتراضي لعناصر HTML ويسمى هذا الملف بـ User agent Stylesheet. ومع كل تحميل جديد لصفحة الويب، يقوم المتصفح بتحميل ملف الـ User agent Stylesheet قبل تحميل أي ملف أنماط أخر. وجميع ملفات User agent Stylesheet في كل المتصفحات متشابهة إلى حد كبير.

في ملف CSS Reset نقوم بإعادة تعيين النمط (الشكل) الإفتراضي لعناصر HTML، حتى نتجنب الشكل الإفتراضي للعناصر الذي يتم تعينه إفتراضياً بواسطة المتصفح في ملف User agent Styleshee.

على سبيل المثال، يقوم متصفح كروم و فيرفوكس بوضع هوامش خارجية (margins) للعنصر <p> بشكل افتراضي 16px في الأعلى والأسفل، ماذا لو أردت أن تظهر جميع عناصر الفقرات النصية في صفحة الويب بدون هوامش علوية وسفليه؟ أو أن تزيد الهوامش قليلاً لجميع الفقرات النصية؟
في هذة الحالة نقوم بإعادة تعيين القيمة الإفتراضية الجديدة للعنصر <p> في ملف إعادة التعيين CSS Reset كالتالي:

أيضاً يظهر العنصر <h1>  بشكل إفتراضي بحجم الخط 2em هكذا font-size: 2em ، ماذا لو أردت أن تزيد حجم الخط قليلاً وأيضاً جعل ارتفاع الخط line-height  أكثر قليلاً من الشكل الإفتراضي؟ نقوم بذلك في ملف CSS Reset كالتالي:

وهكذا لجميع عناصر HTML ، لكن من حسن الحظ أنك لن تقوم بهذة الوظيفة، فقد قام الكثير من المطوررين بإنشاء ملفات إعادة التعيين ويمكنك إستخدام واحداً منها مباشرةً.

من أشهر ملفات إعادة التعيين CSS Reset:

1. Normalize.css
2. CSS-Reset
3. Reset-css
4. Complete CSS Reset