ہر CSS unit براؤز کریں — absolute (px، cm، pt)، font-relative (em، rem، ch)، viewport (vw، dvh)، container-query، grid (fr)، angle، time اور resolution — ایک قابلِ تلاش، type کے مطابق filter ہونے والے حوالے میں ایک وضاحت، ایک "کب استعمال کریں" نوٹ اور کاپی کے لیے تیار tokens کے ساتھ۔ براؤزر میں، مفت۔

ہر CSS unit، وضاحت کے ساتھ۔ سب کچھ آپ کے براؤزر میں ایک built-in حوالے سے چلتا ہے — سرور کو کچھ نہیں بھیجا جاتا۔

کوئی unit آپ کی تلاش سے مطابقت نہیں رکھتا۔
کوئی مختلف unit یا زمرہ آزمائیں — مثال کے طور پر rem، dvh، fr یا angle۔

CSS یونٹس کا حوالہ کے بارے میں

CSS Units Reference زبان کی ہر یونٹ دستاویز کرتا ہے — کل 45 — ٹائپ کے مطابق منظم: مطلق یونٹس جیسے px، cm اور pt؛ فونٹ-متعلقہ یونٹس جیسے em، rem، ch اور lh؛ ویو پورٹ یونٹس vw اور vh سے لے کر نئے svh، lvh اور dvh تک؛ کنٹینر-کوئری یونٹس جیسے cqw اور cqi؛ گرڈ fr یونٹ؛ اور زاویہ، وقت، ریزولوشن اور فیصد۔

ہر کارڈ آپ کو تعریف سے زیادہ دیتا ہے: کاپی ایبل مونو اسپیس میں یونٹ ٹوکن، اس کا مکمل نام، اس کا زمرہ، یہ کیسے شمار کیا جاتا ہے اس کی سادہ زبان میں وضاحت، اور ایک عملی "کب استعمال کریں" نوٹ جو بتاتا ہے کہ یونٹ کہاں اپنی جگہ کماتا ہے — اور کہاں کوئی دوسرا بہتر کام کرتا ہے۔

تلاش ٹوکنز، ناموں اور معنی سے میچ کرتی ہے، تو rem، viewport width اور root سب اپنی یونٹس ڈھونڈ لیتے ہیں، اور ٹائپ چپس گرڈ کو ایک فیملی تک فلٹر کرتی ہیں۔ سب کچھ آپ کے براؤزر میں ایک بلٹ ان ریفرنس سے چلتا ہے، سرور کو کچھ بھی بھیجے بغیر۔

CSS یونٹس کا حوالہ استعمال کرنے کا طریقہ

  1. ٹوکن، نام یا معنی سے یونٹ تلاش کریں — مثال کے طور پر rem، viewport width یا angle۔
  2. گرڈ کو مطلق، فونٹ-متعلقہ، ویو پورٹ، کنٹینر، گرڈ، زاویہ، وقت، ریزولوشن یا فیصد یونٹس تک فلٹر کرنے کے لیے ٹائپ چپس استعمال کریں۔
  3. صحیح یونٹ منتخب کرنے کے لیے ہر یونٹ کی تفصیل اور "کب استعمال کریں" نوٹ پڑھیں۔
  4. اپنی اسٹائل شیٹ کے لیے یونٹ ٹوکن حاصل کرنے کے لیے کاپی بٹن پر کلک کریں۔

اکثر پوچھے جانے والے سوالات

فونٹ سائز اور ہر اس چیز کے لیے rem استعمال کریں جسے صارف کے پسندیدہ ٹیکسٹ سائز کے ساتھ اسکیل ہونا چاہیے — rem روٹ فونٹ سائز کو ٹریک کرتا ہے، تو براؤزر ایکسیسبیلیٹی سیٹنگز کام کرتی ہیں۔ ان چیزوں کے لیے px استعمال کریں جنہیں بصری طور پر مستقل رہنا ضروری ہے، جیسے ہیئر لائن بارڈرز۔

em موجودہ ایلیمنٹ کے اپنے فونٹ سائز سے متعلقہ ہے، تو نیسٹڈ ایلیمنٹس ویلیو کو مرکب کرتے ہیں؛ rem ہمیشہ روٹ ایلیمنٹ سے متعلقہ ہوتا ہے، قابل پیشین گوئی نتائج دیتے ہوئے۔ اسی لیے rem اسپیسنگ اور ٹائپ اسکیلز کے لیے ڈیفالٹ انتخاب بن گیا ہے۔

موبائل براؤزرز اپنے ٹول بارز دکھاتے اور چھپاتے ہیں، مرئی اونچائی بدلتے ہوئے، جبکہ vh بڑے لے آؤٹ سائز پر مستقل رہتا ہے۔ ڈائنامک یونٹ dvh حقیقی مرئی اونچائی کو ٹریک کرتا ہے جیسے ٹول بارز حرکت کرتے ہیں، اور svh/lvh سب سے چھوٹی اور سب سے بڑی حالتوں پر پن ہوتے ہیں۔

fr گرڈ کنٹینر کی خالی جگہ کو فریکشن کے مطابق تقسیم کرتا ہے: grid-template-columns: 2fr 1fr پہلے کالم کو دوسرے کے بچے ہوئے چوڑائی سے دگنا دیتا ہے، فکسڈ ٹریکس اور گیپس گھٹانے کے بعد۔ یہ صرف گرڈ ٹریک تعریفات کے اندر موجود ہوتا ہے۔

یہ ویو پورٹ کے بجائے ایلیمنٹس کو اپنے قریب ترین کوئری کنٹینر کے متعلقہ سائز دیتے ہیں: cqw کنٹینر کی چوڑائی کا 1% ہے، cqi اس کے inline سائز کا 1%۔ یہ کسی کمپوننٹ کو اس باکس کے مطابق اسکیل کرنے دیتے ہیں جس میں وہ رہتا ہے، اسکرین سائز سے آزاد طور پر۔

جی ہاں۔ تمام 45 یونٹس ایک ایسے صفحے میں مفت دستاویز کیے گئے ہیں جو مکمل طور پر آپ کے براؤزر میں چلتا ہے — نہ سائن اپ، نہ سرور کو ریکویسٹس۔

شیئر کریں
مدد چاہیے؟
اس ٹول میں کوئی مسئلہ ملا؟ ہماری ٹیم کو بتائیں۔
مسئلہ رپورٹ کریں

اس مفت ٹول کو اپنی ویب سائٹ پر شامل کریں — نیچے دیا گیا کوڈ کاپی اور پیسٹ کریں۔