حوّل px وrem وem وpt و% مع جدول حي وCSS جاهز للنسخ

القيمة المراد تحويلها
px
px

rem نسبي إلى حجم الخط الجذري؛ وem و% نسبيان إلى العنصر الأصل.

القيم المحوّلة
px
0
rem
0
em
0
pt
0
%
0
القيم الشائعة
PXREMEMPT
10
12
14
16
18
20
24
28
32
40
48
64
مقتطف CSS

						

حول محوّل البكسل إلى EM/REM

يحوّل محوّل px إلى EM/REM قيم الطول في CSS بين px وrem وem وpt والنسبة المئوية. أدخل قيمة بأي من الوحدات الخمس، ويعرض جدول حي مكافئها في جميع الوحدات الأخرى — إلى جانب مقتطف CSS جاهز للنسخ يمكنك لصقه مباشرة في ورقة الأنماط.

تراعي التحويلات كيفية معالجة CSS الفعلية للوحدات: rem نسبية إلى حجم خط الجذر، بينما em والنسبة المئوية نسبيتان إلى حجم خط العنصر الأب. كلا الحجمين المرجعيين قابل للتعديل، ما يتيح لك محاكاة جذر بحجم 16px مع عنصر بحجم 14px، أو أي مقياس نظام تصميم تستخدمه.

يربط جدول القيم الشائعة الأحجام التي يلجأ إليها المصممون غالبًا — لتُجاب أسئلة مثل "كم يساوي 24px بوحدة rem" بنظرة سريعة. الأداة مجانية، وتُحدَّث أثناء الكتابة، وهي أساسية لتحويل تصاميم بيكسل ثابتة إلى CSS قابل للتوسع يعتمد على rem وسهل الوصول.

كيفية استخدام محوّل البكسل إلى EM/REM

  1. أدخل القيمة المراد تحويلها واختر وحدتها: px، rem، em، pt أو %.
  2. اضبط حجم خط الجذر (لـ rem) وحجم خط العنصر الأب (لـ em والنسبة المئوية) إذا كانا مختلفين عن 16px.
  3. اقرأ القيم المحوّلة في الجدول الحي.
  4. انسخ مقتطف CSS المُولَّد أو أي قيمة من جدول القيم الشائعة.

الأسئلة الشائعة

rem نسبية دائمًا إلى حجم خط الجذر (html)، بينما em نسبية إلى حجم الخط الموروث للعنصر الحالي. تتراكم قيم em المتداخلة، ولهذا تكون rem عادة أكثر قابلية للتنبؤ في التخطيط.

مع حجم خط الجذر الافتراضي 16px، يساوي 16px بالضبط 1rem. غيّر حقل حجم الجذر وتُعاد الحسابات — عند جذر بحجم 18px، يصبح 16px نحو 0.889rem.

تتوسع قيم rem عندما يغيّر المستخدمون حجم الخط الأساسي في متصفحهم، ما يبقي النص مقروءًا لمن يحتاجون خطًا أكبر. تتجاهل أحجام px الثابتة هذا التفضيل، وهو ما يضر بإمكانية الوصول.

يعرّف CSS النقطة الواحدة (pt) بـ 1/72 من البوصة، وpx بـ 1/96، لذا 1pt = 1.333px و12pt = 16px. تظهر النقاط غالبًا في أوراق أنماط الطباعة والمستندات المستوردة من معالجات النصوص.

بالنسبة لحجم الخط، تكون النسبة المئوية نسبية إلى حجم خط العنصر الأب، تمامًا مثل em: 100% تساوي حجم الأب، لذا 87.5% من أب بحجم 16px هي 14px. اضبط حقل حجم الأب ليطابق سياقك.

شارك هذا

عمليات البحث الشائعة
محوّل px إلى rem محوّل px إلى em بكسل إلى rem rem إلى px محوّل وحدات css حاسبة px em rem
هل تحتاج إلى مساعدة؟
هل واجهت مشكلة في هذه الأداة؟ أخبر فريقنا.
الإبلاغ عن مشكلة

أضف هذه الأداة المجانية إلى موقعك الخاص — انسخ والصق الكود أدناه.