ترجم مواصفة Figma بـ px (فجوة 16 px) إلى rem لإطار عمل CSS يفضّل rem.
حوّل حجم pt مناسب للطباعة (12 pt) إلى ما يعادله بـ px على الشاشة (16 px).
اعثر على مكافئ rem لـ 14 px عندما يكون حجم خط الجذر 18 px بدلًا من 16.
خطّط لحجم عنوان متجاوب بـ vw وتحقّق من كيف يُعرَض على شاشة عرض بعرض 1440 px.
تحقّق فعليًا من كيف يُعرَض font-size: 1.25rem بالبكسل على جهاز حقيقي.
حول محول وحدات CSS
يترجم محوّل وحدات CSS بين px وrem وem وpt وvw وvh فورًا. إنه مجاني ويعمل في متصفحك ولا يخزّن أي بيانات. أداة أساسية لمطوري الواجهات الأمامية الذين يبنون مواقع متجاوبة ويضمنون تناسق الخط عبر الأجهزة.
الأسئلة الشائعة
كيف أحوّل بين وحدات CSS؟
أدخل قيمة بأي وحدة CSS مدعومة وحدد حجم الخط الأساسي إذا لزم الأمر. تعرض الأداة فورًا القيم المكافئة بـ px وrem وem وpt وvw وvh، مما يسهّل الترجمة بين الوحدات لأوراق أنماطك.
هل تُخزّن بياناتي أثناء التحويل؟
لا، تتم جميع التحويلات في متصفحك. لا تُنقل أي قيم أو إعدادات إلى أي خادم. تعمل الحاسبة بالكامل على جهازك مع خصوصية كاملة.
ما الفرق بين rem وem؟
كلاهما وحدات CSS نسبية. rem نسبية لحجم خط العنصر الجذري، عادةً 16px افتراضيًا، مما يجعلها متسقة في جميع أنحاء الصفحة. em نسبية لحجم خط العنصر الأب، لذا يمكن أن تتراكم عند التداخل. يُفضّل عمومًا استخدام rem للتحجيم المتسق.
لماذا يعطي em النتيجة نفسها كـ rem هنا؟
في CSS، يكون em نسبيًا إلى حجم خط العنصر الأب، بينما rem نسبي إلى عنصر الجذر. لا يعرف المحوّل عنصرك الأب، لذا يستخدم القاعدة نفسها لكليهما — معاملًا em فعليًا كـ«em-at-root»، مطابقًا لـ rem. للحصول على تحويل em دقيق، أدخل حجم خط الأب المحدّد لديك في حقل القاعدة.
هل pt هو نفسه كما كان في طباعة الطباعة؟
على الشاشة، يحدّد CSS أن 1 pt = 1/72 inch و1 inch = 96 px، لذا 1 pt = 96/72 ≈ 1.333 px. هذا مستقل عن كثافة البكسل الفيزيائية (لا تزال شاشة Retina تعرض 1 pt كـ 1.333 بكسل CSS). التحويل دقيق ضمن تعريف بكسل CSS؛ يعتمد حجم الطباعة الفيزيائي على DPI طابعتك.