📐 محول البكسل إلى REM و EM
تحويل بين الوحدات المطلقة والنسبية في CSS
📌 الفرق بين الوحدات
- px: وحدة مطلقة ثابتة
- rem: نسبة من حجم الخط الأساسي للصفحة (1rem = 16px افتراضياً)
- em: نسبة من حجم خط العنصر الأب
محوّل البكسل إلى REM و EM
يساعد هذا المحوّل مصممي الويب ومطوّري الواجهات على تحويل قيم البكسل الثابتة إلى الوحدتين النسبيتين rem وem. تتكيّف الوحدات النسبية مع حجم خط المستخدم، مما يجعل التصاميم أكثر مرونة وسهولة في الوصول وتجاوباً عبر الهواتف والأجهزة اللوحية والشاشات الكبيرة. فبدلاً من تثبيت كل شيء بالبكسل، يمكنك التعبير عن الأحجام بطريقة تحترم إعدادات متصفح الزائر.
تعتمد العملية الحسابية على حجم الخط الجذري، وهو 16 بكسل افتراضياً في معظم المتصفحات. فقيمة rem هي قيمة البكسل مقسومة على ذلك الحجم الجذري، فيكون 16 بكسل يساوي 1rem و24 بكسل يساوي 1.5rem. وتعمل وحدة em بطريقة مشابهة لكنها نسبية إلى حجم خط العنصر الحالي وليس الجذر.
طريقة الاستخدام
أدخل قيمة بالبكسل، وإن لزم عدّل حجم الخط الأساسي ليطابق مشروعك. تعرض الأداة فوراً القيمتين المكافئتين بـ rem و em لتلصقها مباشرة في ملف CSS. وهذا مفيد لتدرّج الخطوط والتباعد والهوامش واستعلامات الوسائط. واستخدام rem لأحجام الخطوط يبقي النص مقروءاً عندما يكبّر المستخدم حجمه الافتراضي، بينما تفيد em للتباعد الذي ينبغي أن ينمو مع مكوّنه.