← كل الأدوات
/ محول البكسل (PX) إلى REM
محول البكسل (PX) إلى REM
حول من بكسل (px) إلى وحدة REM بناءً على حجم الخط الأساسي لتصميم الويب المتجاوب.
الافتراضي في المتصفحات هو 16px
معاينة كود CSS:
font-size: 1.5rem; /* 24px */
لماذا نستخدم وحدة REM بدلاً من البكسل في CSS؟
في تطوير الويب الحديث، يعد إنشاء تخطيطات يمكن الوصول إليها ومتجاوبة أولوية. قد يمنع استخدام الوحدات الثابتة مثل البكسل (px) العناصر من التوسع بشكل صحيح إذا قام المستخدم بتغيير الحجم الافتراضي لخط المتصفح لأسباب تتعلق بإمكانية الوصول (Accessibility).
وحدة REM هي وحدة نسبية ترتبط بحجم خط العنصر الجذري (عادة وسم <html>، والذي يكون افتراضياً 16px). تساعد هذه الحاسبة مطوري الواجهات الأمامية على تحويل تصميماتهم بالبكسل بسلاسة إلى وحدات REM لإنشاء CSS مرن ومتجاوب.
الأسئلة الشائعة
REM نسبي لحجم خط عنصر HTML الجذري (الأساسي). أما EM فهو نسبي لحجم خط العنصر الأب المباشر له. يُفضل استخدام REM للقياسات العامة لأنه يمنع مشكلات تضاعف الأحجام الناتجة عن تداخل وسوم EM.
تضبط جميع متصفحات الويب تقريبًا حجم الخط الجذري الافتراضي على 16 بكسل. وبالتالي، فإن 1rem يساوي 16px افتراضيًا.
يوصى بشدة باستخدام REM للخطوط (font-size) والمسافات (margin, padding). ومع ذلك، قد يكون البكسل أفضل للعناصر الجامدة مثل الحدود (مثلاً 1px solid black).