محول وحدات CSS
تحويل وحدات CSS واحد لواحد بين px وrem وem و% وvw وvh وvmin وvmax وpt وcm وmm وq وex وch محليًا باستخدام حجم الخط الجذر وحجم الخط الأصلي وإطار العرض وDPI والإعدادات المرجعية المئوية.
بكسل
px
اضغط للتبديل بين الوحدات
وحدات الطول
الطباعة
إطار العرض
النسبة المئوية
نسبي إلى حجم خط الجذر
rem
اضغط للتبديل بين الوحدات
وحدات الطول
الطباعة
إطار العرض
النسبة المئوية
محول وحدات CSSأدخل قيمة واختر وحدة المصدراختر وحدة الوجهة أو استخدم «تبديل» للعكساضبط سياق rem/em/%/vw/vh عند الحاجةانسخ نتيجة التحويلبدّل إعدادات منفذ العرض المسبقة لفحص vw/vh
بداية سريعة
1
2
3
4
5
سيناريوهات شائعة
الاستخدامات
تخطيطات متجاوبة، تسليم التصميم إلى التطوير، مواءمة الكثافة/الطباعة، توحيد الأعراف
نصائح الاستخدام
تعيين الأساس: 16px للجذر شائع ويسهّل حساب rem ↔ px
النصوص rem: يسهّل التكبير العام وإتاحة الوصول؛ em لقياس محلي داخل المكوّن
استخدم وحدات إطار العرض لتقديرات التخطيط: ادمجها مع نقاط التوقف وقيود الحد الأدنى/الأقصى لتجنب الحدود القصوى
الكسور والتقريب: احتفظ بدقة معقولة لتحسين قابلية القراءة
المعلمات والسياق
أساس REM (حجم الخط الجذر): يحدد التحويل بين rem ↔ px. الشائع 16px (≈1rem). عدّل عند اختلاف خط الأساس في التصميم.
أساس EM (حجم خط العنصر الأب): يحدد em و% عندما يكون المرجع حجم الخط. مناسب لمقياس محلي على مستوى المكوّن.
مرجع %: اختر حجم الخط / العرض / الارتفاع حسب السياق (تخطيط مقابل طباعة).
قوالب نقاط التوقف تضبط أيضًا أبعاد منفذ العرض لتقدير سريع (ليست media query وقت التشغيل).
أبعاد منفذ العرض لـ vw/vh/vmin/vmax و% (العرض/الارتفاع). تختلف الأجهزة الفعلية بسبب أشرطة العنوان / مناطق الأمان / أشرطة التمرير.
DPI (نقطة في البوصة): للوحدات المادية pt/pc/in/cm/mm/q ↔ px. التقدير الافتراضي لـ CSS هو 96 نقطة في البوصة؛ القيم المخصصة هي تقديرات الطباعة/الجهاز وليست حساب التخطيط النهائي للمتصفح.
نصائح: 1) 16 بكسل و96 نقطة لكل بوصة هي قواعد مشتركة؛ 2) التحقق من النسب المئوية للتخطيط عن طريق تبديل نقاط التوقف؛ 3) تساعد عناصر التحكم هذه في تقدير وقت التصميم ولا تحل محل حساب DOM/CSS النهائي للمتصفح.
القيود والتوافقية
يعتمد المرجع % على خاصية CSS، التي تحتوي على الكتلة ووضع التخطيط؛ تستخدم هذه الأداة المرجع المختار لحجم الخط/عرض منفذ العرض/ارتفاع منفذ العرض للتقدير، وليس قياسًا مباشرًا للأصل/الحاوية
ex/ch عبارة عن تقديرات تقريبية بناءً على حجم الخط الأصلي هنا؛ النتائج ليست فحصًا لمقاييس الخط وتختلف عبر الخطوط/المتصفحات
تختلف vw/vh/vmin/vmax الكلاسيكية مع أشرطة التمرير/أشرطة العناوين/المناطق الآمنة؛ لا تقوم هذه الأداة بحساب وحدات استعلام dvh/svh/lvh أو vi/vb أو المنطقة الآمنة أو الحاوية
تستخدم الوحدات المادية ↔ بكسل تقدير DPI الذي تم تكوينه؛ لا يزال عمل الطباعة/HiDPI يتطلب التحقق من صحة الجهاز أو الإثبات
الخصوصية والأمان
تتم المعالجة في المتصفح. قد تبقى قيمة الإدخال ووحدتا From/To وقيم الوحدات المخزنة مؤقتًا وحجم الخط الجذر وحجم خط الأصل وإعدادات viewport وDPI والمرجع المئوي واختيار نقطة التوقف في جلسة المتصفح الحالية أو في تخزين المتصفح. إذا حفظت مساحة عمل أو فعّلت مزامنة WebDAV، فقد تُحفظ هذه القيم وفق إعدادات المزامنة لديك. تُعاد حساب نتائج التحويل من القيمة والوحدات وإعدادات السياق الحالية، ولا تُحفظ كنتائج منفصلة. لا تجلب هذه الصفحة عناوين URL ولا ترسل القيم للتحويل على الخادم. على الأجهزة المشتركة، امسح القيم والإعدادات وبيانات الموقع عند الحاجة.
أسئلة شائعة
rem نسبة إلى خط الجذر (مناسب للتكبير العام)، em نسبة إلى خط الأب (مناسب داخل المكوّن)
للتخطيط والنص يُفضّل rem (إتاحة الوصول)؛ px مناسب للأيقونات/الحدود الدقيقة
تؤثر أشرطة عناوين الهاتف المحمول/المناطق الآمنة/أشرطة التمرير على إطار العرض؛ تتحد مع نقاط التوقف والقيود الدنيا/القصوى
عيّن DPI (مثل 96/72/300). التحويل هنا تقديري؛ للطباعة الفعلية استخدم ملفات ICC وتجارب طباعة