मुख पृष्ठ
/
ऐप्स
/
CSS यूनिट कन्वर्टर
CSS यूनिट कन्वर्टर

CSS यूनिट कन्वर्टर

px, em, rem, pt, pc, in, cm, mm, vw और vh जैसी CSS यूनिट्स को तुरंत आपस में बदलें। सटीक और स्टाइलशीट में सीधे उपयोग होने वाले मान एक साथ देखें।

px, em, rem, pt, pc, in, cm, mm, vw और vh जैसी CSS यूनिट्स को तुरंत आपस में बदलें। सटीक और स्टाइलशीट में सीधे उपयोग होने वाले मान एक साथ देखें।

इस ऐप को साझा करें

CSS यूनिट कन्वर्टर

CSS में दर्जनभर अलग-अलग लंबाई यूनिट्स होती हैं - px, pt, in, cm जैसी absolute यूनिट्स, em और rem जैसी font-relative यूनिट्स, और vw तथा vh जैसी viewport-relative यूनिट्स। इन्हें आपस में मिला देना स्टाइलशीट में असंगत स्पेसिंग की सबसे आम वजहों में से एक है। यह टूल किसी भी दो CSS यूनिट्स के बीच एक मान को बदलता है और आपके दिए गए base font size और viewport dimensions का उपयोग करते हुए वही मान सभी समर्थित यूनिट्स में एक साथ दिखाता है।

Absolute यूनिट्स

Absolute यूनिट्स font size या स्क्रीन से स्वतंत्र, एक-दूसरे के सापेक्ष स्थिर होती हैं। ये सभी उसी संदर्भ (प्रति इंच 96px) के माध्यम से पिक्सेल में बदलती हैं जिसका उपयोग ब्राउज़र करते हैं:

1 in=96 px,1 cm=962.54 px,1 mm=9625.4 px1\ in = 96\ px, \qquad 1\ cm = \frac{96}{2.54}\ px, \qquad 1\ mm = \frac{96}{25.4}\ px 1 pt=9672 px,1 pc=16 px1\ pt = \frac{96}{72}\ px, \qquad 1\ pc = 16\ px

Font-relative यूनिट्स

rem हमेशा root (<html>) एलिमेंट के font size के सापेक्ष होता है, जबकि em वर्तमान एलिमेंट के font size के सापेक्ष होता है। यह टूल एक ही base font size मांगता है और इसे दोनों के लिए उपयोग करता है, जो तब सटीक रहता है जब आप जिस एलिमेंट को स्टाइल कर रहे हैं उसका अपना अलग font-size override न हो:

1 em=1 rem=base_font_size (px)1\ em = 1\ rem = base\_font\_size\ (px)

Viewport-relative यूनिट्स

vw और vh, ब्राउज़र के viewport की चौड़ाई और ऊंचाई के प्रतिशत होते हैं, इसलिए इन्हें बदलने के लिए आपको जिस viewport आकार के लिए डिज़ाइन कर रहे हैं वह चाहिए:

1 vw=viewport_width100 px,1 vh=viewport_height100 px1\ vw = \frac{viewport\_width}{100}\ px, \qquad 1\ vh = \frac{viewport\_height}{100}\ px

कन्वर्जन कैसे काम करता है

हर यूनिट को पहले पिक्सेल के एक सामान्य आधार में बदला जाता है, फिर पिक्सेल से लक्ष्य यूनिट में:

px=value×factorfrom,result=pxfactortopx = value \times factor_{from}, \qquad result = \frac{px}{factor_{to}}

इस टूल का उपयोग कैसे करें

  1. वह संख्यात्मक value दर्ज करें जिसे आप बदलना चाहते हैं
  2. वह यूनिट जिससे बदलना है और वह यूनिट जिसमें बदलना है चुनें
  3. em/rem के लिए उपयोग होने वाला base font size सेट करें (डिफ़ॉल्ट 16px है)
  4. vw/vh के लिए उपयोग होने वाली viewport width और viewport height सेट करें
  5. सभी समर्थित यूनिट्स में बदला हुआ मान और पूरी टेबल देखने के लिए सबमिट करें

हल किया गया उदाहरण

24px को rem में बदलना, जहां base font size 16px है:

result=2416=1.5 remresult = \frac{24}{16} = 1.5\ rem

इसलिए जब root font size 16px हो, तो font-size: 24px और font-size: 1.5rem एक ही रेंडर हुआ टेक्स्ट साइज़ देते हैं - यही वजह है कि आधुनिक, accessibility-friendly स्टाइलशीट में 1.5rem लिखना ज़्यादा आम तरीका है।