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

संदर्भ

CSS यूनिट

CSS एब्सोल्यूट और रिलेटिव दोनों यूनिट प्रदान करता है। px जैसी एब्सोल्यूट यूनिट संदर्भ की परवाह किए बिना निश्चित होती हैं। rem, em और vw जैसी रिलेटिव यूनिट एक संदर्भ के आधार पर स्केल होती हैं।

px, rem, em, vw

px (पिक्सल) — एक एब्सोल्यूट यूनिट। बॉर्डर, शैडो के लिए उपयोग करें।

rem (रूट em) — html एलिमेंट के फॉन्ट साइज़ के सापेक्ष। डिफ़ॉल्ट 16px है। फॉन्ट साइज़ और स्पेसिंग के लिए पसंदीदा।

em — पैरेंट एलिमेंट के फॉन्ट साइज़ के सापेक्ष।

vw (व्यूपोर्ट चौड़ाई) — 1vw = व्यूपोर्ट चौड़ाई का 1%। फ्लूइड टाइपोग्राफी के लिए बढ़िया।

सामान्य px से rem कन्वर्शन

डिफ़ॉल्ट ब्राउज़र बेस 16px के साथ: 12px = 0.75rem, 14px = 0.875rem, 16px = 1rem, 18px = 1.125rem, 20px = 1.25rem, 24px = 1.5rem, 32px = 2rem, 48px = 3rem। 1440px डिज़ाइन पर व्यूपोर्ट यूनिट के लिए: 14.4px = 1vw, 72px = 5vw।

एक्सेसिबिलिटी के लिए rem क्यों पसंदीदा है

फॉन्ट साइज़ के लिए rem का उपयोग उपयोगकर्ता की ब्राउज़र फॉन्ट-साइज़ प्राथमिकता का सम्मान करता है। जब उपयोगकर्ता अपना ब्राउज़र डिफ़ॉल्ट 16px के बजाय 20px पर सेट करता है, तो rem-आधारित लेआउट आनुपातिक रूप से स्केल होता है जबकि px-आधारित लेआउट निश्चित रहता है। WCAG 1.4.4 (टेक्स्ट रिसाइज़) की आवश्यकता है कि टेक्स्ट को सामग्री या कार्यक्षमता खोए बिना 200% तक रिसाइज़ किया जा सके — rem यूनिट स्वाभाविक रूप से इस आवश्यकता को पूरा करती हैं।

गोपनीयता

सभी कन्वर्शन 100% आपके ब्राउज़र में चलता है। कोई डेटा सर्वर को नहीं भेजा जाता।