CSS Reset سفارشی: شروع تمیز برای هر پروژه
فرانتاند
جاوااسکریپتخلاصهٔ کاملتر
وقتی یه پروژه وب میسازی، مرورگرها یه سری استایل پیشفرض دارن که کسی ازشون نخواسته! این استایلهای پیشفرض بین Chrome، Firefox، Safari و بقیه مرورگرها فرق دارن و میتونن باعث بشن که طراحیت روی مرورگرهای مختلف یکجور نباشه.
یکی از رایجترین مشکلاتی که این تفاوتها ایجاد میکنن، line-height هست که مستقیماً روی فاصلهگذاری، ارتفاع المانها و تراز متنها تأثیر میذاره. در نتیجه چیزی که روی یه مرورگر عالی به نظر میرسه، ممکنه روی یه مرورگر دیگه کج و کوله بشه.
راهحل این مشکل CSS Reset هست؛ یه فایل استایل که قبل از همه استایلهای دیگه لود میشه و استایلهای پیشفرض مرورگرها رو صفر میکنه. اینجوری میتونی با خیال راحت طراحیت رو روی یه پایه یکسان و قابل پیشبینی بنا کنی.
اولین CSS Reset معروف رو اریک مایر در سال ۲۰۱۱ منتشر کرد و خودشم تأکید داشت که این ریست رو متناسب با نیاز خودتون تغییر بدید. از اون موقع تا الان خیلی چیزا عوض شده و استانداردهای مرورگرها پیشرفت کردن، ولی هنوزم تفاوتهایی وجود داره که وجود یه ریست رو ضروری میکنه.
این پروژه یه نسخه بهروزشده و مدرن از CSS Reset ارائه میده که بر اساس تجربه کار واقعی و بررسی دقیق سایتهای مدرن و حرفهای گردآوری شده. هدفش اینه که یه پایه محکم و قابل اعتماد باشه که بشه روش کار کرد و حسب نیاز تغییرش داد.
استفاده ازش هم خیلی سادهست؛ کافیه فایل reset.css رو توی پروژهات کپی کنی و اون رو در ابتدای استایلشیت اصلیت ایمپورت کنی تا مطمئن بشی قبل از همه استایلهای دیگه لود میشه.
یه نکته مهم اینه که این ریست بهتره از ابتدای پروژه استفاده بشه. اگه بخوای بعداً توی یه کدبیس موجود اضافهاش کنی، باید آماده باشی که تغییرات جدی توی لایوت و استایل سایت ببینی و اونها رو مدیریت کنی.
نکات کلیدی:
- مرورگرها استایلهای پیشفرض متفاوتی دارن که میتونه باعث ناسازگاری ظاهری بین مرورگرها بشه
- CSS Reset این تفاوتها رو پاک میکنه و یه نقطه شروع یکسان فراهم میکنه
- این پروژه نسخه مدرن و بهروزشدهای از ریست معروف اریک مایر (2011) ارائه میده
- فایل reset.css رو باید در ابتدای استایلشیت اصلی ایمپورت کرد تا اول از همه اجرا بشه
- بهتره از اول پروژه استفاده بشه؛ اضافه کردنش به پروژههای موجود ممکنه تغییرات ناخواسته ایجاد کنه
- این ریست بهعنوان یه پایه طراحی شده که میشه متناسب با نیاز هر پروژه سفارشیسازیش کرد
