روٹ عنصر کے فونٹ سائز، پیرنٹ عنصر کے فونٹ سائز اور DPI سے px کو rem، em، pt، پائیکا، انچ اور mm میں بدلیں۔ CSS میں 1 in = 96 px = 72 pt مقرر ہے۔
بامعنی ہندسے: 10؛ قریب ترین؛ برابر فاصلے پر صفر سے دور
CSS کی صورت میں
1.5rem
پکسل میں
24px
16 px روٹ فونٹ اور 96 پکسل فی انچ کے ساتھ 24px برابر ہے 1.5rem کے۔
فونٹ سائز کے ساتھ پکسل میں حجم
ہر اکائی میں 24px قطاریں: 10
اکائی
قدر
تعریف
پکسل (px)
24px
1 px
ٹائپوگرافی پوائنٹس (pt)
18pt
1 pt = 1/72 in
پائیکا (pc)
1.5pc
1 pc = 12 pt = 1/6 in
انچ (in)
0.25in
1 in = DPI px
سینٹی میٹر (cm)
0.635cm
1 cm = 1/2.54 in
ملی میٹر (mm)
6.35mm
1 mm = 1/25.4 in
چوتھائی ملی میٹر (Q)
25.4Q
1 Q = 0.25 mm
em (پیرنٹ فونٹ کا سائز)
1.5em
1 em = parent font size
rem (روٹ فونٹ کا سائز)
1.5rem
1 rem = root font size
پیرنٹ فونٹ کے سائز کا فیصد (%)
150%
100% = parent font size
حساب کا طریقہ S
ایک px میں پکسل
1px=1px
1 px
پکسل میں قدر
24×1=24px
ایک rem کے پکسلوں کی تعداد سے تقسیم کریں
1624=1.5rem
1 rem = root font size
CSS اکائی کنورٹر (px سے rem، em، pt) کے بارے میں
CSS لمبائی کو پکسل کے ذریعے بدلتا ہے۔ مطلق اکائیوں کے تناسب عین ہیں: 1 in = 2.54 cm = 96 px = 72 pt = 6 pc؛ 1 Q ملی میٹر کا چوتھائی ہے۔ فونٹ سے متعلق اکائیاں صفحے پر منحصر ہیں: 1 rem روٹ فونٹ سائز؛ font-size مقرر کرتے وقت 1 em یا 100% پیرنٹ فونٹ سائز ہے۔ کنورٹر پہلے پکسل بناتا، پھر مطلوبہ اکائی کے پکسلوں سے تقسیم کرتا ہے۔
ویب ڈویلپر ڈیزائن کے پکسل rem میں بدلتے ہیں تاکہ، اگر جڑ کا فونٹ قاری کی ترجیح کے مطابق ہو، متن بھی اس کے مطابق بدلے: پہلے سے مقرر 16 px جڑ پر 24 px برابر 1.5 rem ہے۔ طباعتی ڈیزائنر پکسل فی انچ والا خانہ لیتے ہیں؛ 300 DPI پر 10 mm لوگو کو تقریباً 118 پکسل درکار ہیں۔
اسکرین پر CSS انچ ضروری نہیں کہ ناپے ہوئے انچ کے برابر ہو۔ CSS میں 96 px فی انچ کا تناسب ہے اور حوالہ پکسل کا زاویۂ نظر تقریباً 0.0213° ہے۔ پیمانے سے مطابقت ذریعے اور درست طباعتی ترتیب پر منحصر ہے۔
فارمولے میں xₛ اور xₜ ابتدائی اور آخری قدریں؛ pₛ اور pₜ ابتدائی اور آخری اکائی کے پکسل ہیں۔ یہ عوامل درج کردہ فونٹ سائز اور پکسل کثافت استعمال کرتے ہیں۔
خط کے سائز کا حوالہ دیں
قدر، اکائیاں، روٹ فونٹ اور پیرنٹ فونٹ کے سائز دیں۔ فی اکائی پکسل عوامل x_target = x_source × p_source / p_target میں استعمال ہوتے ہیں۔ rem روٹ سے متعلق ہے؛ یہاں em اور فیصد کا ماڈل فونٹ سائز کے لیے پیرنٹ استعمال کرتا ہے۔
حوالہ جاتی مثال جانچیں
root = 16 px; 24 px = 1.5 rem، لیکن root = 20 px; 24 px = 1.2 rem ہے۔ مطلق CSS اکائیوں کا تعلق 1 in = 96 CSS px = 72 pt ہے۔ کثافت والے خانے سے حقیقی پکسل بھی گنے جا سکتے ہیں، مثلاً 10 mm × 300/25.4 px/mm ≈ 118.110236 px۔
حوالوں کا موازنہ کریں
لمبے اعشاریے گول کیے گئے ہیں؛ ہر قطار خط کے سائز اور پکسل کثافت کا دیا گیا حوالہ رکھتی ہے۔
مقدار
اصل اکائی
مطلوبہ اکائی
حوالہ
تبدیل شدہ قدر
24
px
rem
روٹ فونٹ 16 px
1.5
24
px
rem
روٹ فونٹ 20 px
1.2
12
pt
px
96 px/in
16
1
pc
pt
96 px/in
12
100
%
em
پیرنٹ فونٹ 16 px
1
10
mm
px
300 px/in
118.110236
متعلقہ CSS خاصیت دیکھیں
100% = 1 em (font-size context) یہاں ماڈل کیے گئے فونٹ سائز کے حوالے میں ہے۔ کسی دوسری CSS خاصیت میں em یا فیصد کا حوالہ مختلف ہو سکتا ہے۔ آلہ آپ کی اسٹائل شیٹ یا عنصر کے باکس کی پیمائش نہیں پڑھتا۔
حقیقی پکسل کثافت بدلنے سے CSS پکسل کی تعریف نہیں بدلتی۔ اسکرین کا CSS انچ لازماً فیتے سے ناپے گئے حقیقی انچ کے برابر نہیں۔ براؤزر اور پرنٹ میں نتیجہ دیکھیں؛ لمبائی کا کنورٹر خط کے حوالے سے الگ حقیقی لمبائی کے لیے ہے۔
جانچ کا ماخذ: CSS Values 3 §6.1 کے مطابق جانچ: 1rem = روٹ فونٹ سائز (براؤزر کی عام ابتدائی قدر 16 px)؛ 24 / 16 = 1.5۔
12 pt کو px میں
قدر
12
سے
ٹائپوگرافی پوائنٹس (pt)
میں
پکسل (px)
روٹ فونٹ کا سائز (rem کے لیے)
16 px
تبدیل شدہ قدر
16 px
CSS کی صورت میں
16px
جانچ کا ماخذ: CSS Values 3 §6.2 کے مطابق جانچ: 1pt = 1/72 in، 1in = 96px؛ 12 × 96/72 = 16۔
1 انچ کو CSS پکسل میں
قدر
1
سے
انچ (in)
میں
پکسل (px)
روٹ فونٹ کا سائز (rem کے لیے)
16 px
تبدیل شدہ قدر
96 px
جانچ کا ماخذ: CSS Values 3 §6.2 کے مطابق جانچ: 1in = 96px۔
1.5 rem کو px میں
قدر
1.5
سے
rem (روٹ فونٹ کا سائز)
میں
پکسل (px)
روٹ فونٹ کا سائز (rem کے لیے)
16 px
تبدیل شدہ قدر
24 px
جانچ کا ماخذ: جانچ: 1 rem = روٹ فونٹ کا سائز (16 px)؛ 1.5 × 16۔
سوالات
1 rem کتنے پکسل ہے؟
عام ابتدائی ترتیب میں 16 پکسل۔ ایک rem، روٹ html عنصر کے فونٹ سائز کے برابر ہے؛ براؤزر کی عام ابتدائی قدر 16 px ہے، مگر قاری کی پسند یا اسٹائل شیٹ کا html { font-size } اسے بدل سکتا ہے۔ اسی ابتدائی ترتیب پر html { font-size: 62.5% } سے 1 rem = 10 px بنتا ہے۔ W3C کی CSS Values and Units خصوصیت rem کی تعریف کرتی ہے؛ 16 px براؤزر کی عام ترتیب ہے، خصوصیت کی شرط نہیں۔
px کو pt میں کیسے بدلیں؟
پکسل کو 0.75 سے ضرب دیں؛ پوائنٹ سے پکسل کے لیے 4/3 (تقریباً 1.333) سے۔ دونوں W3C CSS قاعدے سے ہیں: 1 in = 96 px = 72 pt، لہٰذا 1 px = 72/96 pt۔ 16 px متن 12 pt، اور ورڈ پروسیسر کا 11 pt متن تقریباً 14.67 px ہے۔
em اور rem میں کیا فرق ہے؟
rem ہمیشہ جڑ کے فونٹ، em موجودہ عنصر، یا font-size پر والد کے فونٹ سے متعلق ہے۔ یوں اندرونی em ضرب ہوتے ہیں: 1.2em فہرست کے اندر 1.2em فہرست کا متن مشترک ابتدائی بنیاد سے 1.44 گنا ہے۔ مگر 16 px جڑ کے ساتھ 1.2rem ہر گہرائی پر 19.2 px رہتا ہے۔
فونٹ سائز کے لیے px استعمال کروں یا rem؟
قاری کی براؤزر فونٹ ترجیح اپنانے کے لیے rem لیں اور جڑ کے فونٹ کو وہ ترجیح ماننے دیں۔ صفحہ زوم px اور rem دونوں بڑھاتا ہے؛ rem، em اور فیصد جڑ یا والد کے سیاق سے فونٹ ترجیح لے سکتے ہیں۔ WCAG 2.1 معیار 1.4.4 (AA) متن کو مواد یا فعل کھوئے بغیر 200% تک بڑھانے کا تقاضا کرتا ہے۔ براؤزر زوم px سے بھی یہ کر سکتا ہے؛ rem جڑ کی اجازت سے فونٹ ترجیح بھی مان سکتا ہے۔
کیا CSS انچ حقیقی ناپے ہوئے انچ کے برابر ہے؟
CSS انچ کا اسکرین پر ناپے انچ سے ملنا ضروری نہیں۔ CSS میں 1 in عین 96 px ہے؛ W3C حوالہ پکسل، 96 DPI اسکرین کا 28 in دور سے دیکھا پکسل، تقریباً 0.0213° زاویہ ہے۔ آلہ اور فاصلہ بدلتے ہیں، اس لیے فون پر 96 px خانہ انچ سے چھوٹا ہو سکتا ہے۔ اصل حجم کی طباعت میں 1 in = 25.4 mm پیمانے سے مل سکتا ہے؛ پرنٹ اسکیل اور کیلیبریشن بھی اثر انداز ہیں۔
اس کیلکولیٹر میں آزاد ذرائع سے حاصل کردہ جوابات والی 7 حل شدہ مثالیں شامل ہیں۔ یہ ٹیسٹ مجموعے میں چلتی ہیں اور آپ انہیں یہاں بھی چلا سکتے ہیں۔
یہ کیلکولیٹر اپنی سائٹ پر لگائیں
جہاں آپ کیلکولیٹر دکھانا چاہتے ہیں وہاں یہ چسپاں کریں۔ اس کا استعمال مفت ہے، یہاں ہونے والی اصلاحات اس میں شامل ہوتی رہتی ہیں، اور اس کے نیچے دی گئی کریڈٹ لائن یہاں واپس جوڑتی ہے تاکہ آپ کے قاری مکمل نسخہ دیکھ سکیں۔