EM से PX कन्वर्टर क्या है?
EM से PX कन्वर्टर CSS की em यूनिट को निरपेक्ष पिक्सेल में बदल देता है। CSS में em एक सापेक्ष (relative) यूनिट है: 1em उस एलिमेंट के पैरेंट के फ़ॉन्ट साइज़ के बराबर होती है (या नॉन-फ़ॉन्ट प्रॉपर्टीज़ के लिए खुद उसी एलिमेंट के फ़ॉन्ट साइज़ के बराबर)। चूँकि ब्राउज़र डिफ़ॉल्ट रूप से 16px रूट फ़ॉन्ट साइज़ इस्तेमाल करते हैं, इसलिए आम तौर पर 1em का मतलब 16px होता है — लेकिन असली मान इस बात पर निर्भर करता है कि आप कौन-सा बेस फ़ॉन्ट साइज़ चुनते हैं।
इसका इस्तेमाल कैसे करें
जिस em मान को आप बदलना चाहते हैं उसे डालें, फिर बेस फ़ॉन्ट साइज़ को पिक्सेल में भरें। ज़्यादातर ब्राउज़र डिफ़ॉल्ट रूप से 16px लेते हैं, इसलिए यह मान पहले से भरा हुआ रहता है। कैलकुलेट पर क्लिक करते ही आपको बराबर पिक्सेल मान दिख जाएगा। यह तब बहुत काम आता है जब आपको पिक्सेल में दी गई डिज़ाइन स्पेक्स को em में लिखी गई स्टाइलशीट से मिलाना हो।
फ़ॉर्मूला समझें
यह कन्वर्ज़न सिर्फ़ एक साधारण गुणा है:
$$\text{px} = \text{em} \times \text{बेस फ़ॉन्ट साइज़}$$उदाहरण के लिए, 16px बेस पर 1.5em का मतलब है \(1.5 \times 16 = 24\text{px}\)। उल्टी दिशा में जाने के लिए पिक्सेल को बेस से भाग दें: \(\text{px} \div \text{बेस} = \text{em}\)।
हल किया हुआ उदाहरण
मान लीजिए किसी हेडिंग का साइज़ 2.5em सेट है और बेस फ़ॉन्ट साइज़ 16px है। तब पिक्सेल साइज़ होगा \(2.5 \times 16 = 40\text{px}\)। अगर बेस 18px होता, तो वही 2.5em इस तरह रेंडर होती \(2.5 \times 18 = 45\text{px}\) — जिससे साफ़ पता चलता है कि em बेस के हिसाब से कैसे स्केल होती है।
अक्सर पूछे जाने वाले सवाल
क्या 1em हमेशा 16px ही होती है? सिर्फ़ तब, जब बेस फ़ॉन्ट साइज़ ब्राउज़र का डिफ़ॉल्ट 16px हो। अगर पैरेंट या रूट का फ़ॉन्ट साइज़ अलग है, तो 1em भी उसी हिसाब से बदल जाती है।
em और rem में क्या फ़र्क है? rem हमेशा रूट (html) के फ़ॉन्ट साइज़ के सापेक्ष होती है, जबकि em सबसे नज़दीकी फ़ॉन्ट-साइज़ संदर्भ के सापेक्ष होती है, जो कैस्केड होकर एक-दूसरे पर असर डाल सकती है।
px की जगह em क्यों इस्तेमाल करें? em यूनिट यूज़र की फ़ॉन्ट-साइज़ पसंद के साथ स्केल होती हैं, जिससे एक्सेसिबिलिटी बेहतर होती है और रिस्पॉन्सिव टाइपोग्राफ़ी को संभालना आसान हो जाता है।
