پرش به مطلب اصلی

Units

px vs rem

واحد rem بر اساس سایزِ فونتِ المانِ html تعیین میشه. یعنی مثلاً اگه سایز فونت این المان برابر با 16px باشه، هر 1rem برابر با 16px میشه. یا مثلاً 1.5rem برابر با 24px میشه.

اما پیکسل، همیشه پیکسله و متناسب با سایز فونت تغییر نمی‌کنه.

از طرفی بعضی از کاربرها هستن که به دلیل ضعف بینایی یا موارد دیگه، سایز فونت سیستم عامل یا مرورگر خودشون رو تغییر میدن.

اگه از px استفاده کرده باشیم، متن سایت متناسب با تنظیمات کاربر تغییر نمی‌کنه و این فرد موقع استفاده از سایت ما به مشکل می‌خوره.

اما اگه از rem استفاده کنیم، چون تمام اندازه‌ها با توجه به فونتِ html تعیین شدن، کاملاً یکدست تغییر می‌کنن.

بنابراین به جز موارد محدود مثل border و box-shadow نباید از px استفاده کنید.

واحد صفر

تو CSS زمانی که از عدد صفر استفاده می‌کنید، بهتره واحدی براش در نظر نگیرید.

💩 Messy Code
.chiz {
margin: 0rem auto;
}
🧼 Clean Code
.chiz {
margin: 0 auto;
}