px को em में बदलना Pixels ↔ Em मुफ़्त ऑनलाइन सुरक्षित
px में कोई मान लिखिए और उसे वहीं em में पढ़ लीजिए। हिसाब आपके ब्राउज़र में होता है, कहीं कुछ नहीं भेजा जाता, और उत्तर किस पर निर्भर है यह मान नहीं लिया जाता, नीचे लिखा है।
कुछ भी अपलोड नहीं
आम आकार — px को em में बदलना
| px | em |
|---|---|
| 8 | 0.5 |
| 10 | 0.625 |
| 12 | 0.75 |
| 14 | 0.875 |
| 16 | 1 |
| 18 | 1.125 |
| 20 | 1.25 |
| 24 | 1.5 |
| 32 | 2 |
| 48 | 3 |
| 64 | 4 |
ये इकाइयाँ कहाँ से आईं
CSS का पिक्सेल आपके परदे का पिक्सेल नहीं है। जब परदों का घनत्व अनुमेय न रहा, तो असली पिक्सेलों में नापा गया पृष्ठ ऐसा पृष्ठ बन गया जो परदों के महीन होते जाने के साथ सिकुड़ता जाता था; सो CSS पिक्सेल को एक संदर्भ लंबाई के रूप में फिर से परिभाषित किया गया: आरामदेह पठन-दूरी से देखा गया, इंच का लगभग छियानबेवाँ भाग। इस पृष्ठ का शेष सब कुछ उसी पर खड़ा है। em वेब से पुराना है — सीसे के टाइप में वह ढले हुए खंड की चौड़ाई था, जिसका नाम बड़े M से लिया गया — और CSS में उसका अर्थ है प्रवर्तमान फ़ॉन्ट का आकार, इसीलिए तत्वों को एक-दूसरे में रखने पर वह बदलता है। rem ठीक इसी से बचने के लिए जोड़ा गया: वह मूल तत्व का em है और कभी संचित नहीं होता। vw अनुक्रियाशील अभिकल्प के साथ आया: दृश्य-क्षेत्र की चौड़ाई का सौवाँ भाग, वह चौड़ाई जो भी निकले।
ये आपको कहाँ मिलती हैं
ये हर स्टाइलशीट की इकाइयाँ हैं। पिक्सेल किनारों, छायाओं और हर उस वस्तु का माप तय करते हैं जिसे बढ़ना नहीं चाहिए; rem अक्षर, अंतराल और विन्यास का माप तय करता है, सो मूल पर एक ही परिवर्तन पूरे अंतरापृष्ठ का आकार बदल देता है; em उन वस्तुओं का माप तय करता है जिन्हें अपने ही पाठ के पीछे चलना चाहिए, जैसे बटन के भीतर की जगह; vw उन शीर्षकों और आरंभिक पट्टियों का जिन्हें हर उपकरण पर परदा भर देना है। इनके बीच रूपांतरण वही दैनिक गणित है जिससे पिक्सेलों में सौंपा गया अभिकल्प ऐसी स्टाइलशीट बनता है जो घटती-बढ़ती है।
अक्सर पूछे जाने वाले प्रश्न
16 px ही सामान्य आरंभ-बिंदु क्यों है?
क्योंकि हर बड़े ब्राउज़र में पाठ का डिफ़ॉल्ट आकार यही है, और जो स्टाइलशीट उसे न बदले वह उसे उत्तराधिकार में पाती है। सो डिफ़ॉल्ट सेटिंग पर एक rem 16 px के बराबर होता है, और परिचित रूपांतरण वहीं से आते हैं: 0.5 rem अर्थात 8 px, 1.5 rem अर्थात 24 px। यदि उपयोक्ता ने ब्राउज़र की सेटिंग में डिफ़ॉल्ट बड़ा कर रखा हो, तो वही rem मान भी उसके साथ बढ़ जाते हैं — और उन्हें बरतने का प्रयोजन ठीक यही है।
rem बरतूँ या em?
हर उस वस्तु के लिए rem जिसे पूरे पृष्ठ के पीछे चलना चाहिए — अक्षर की सीढ़ी, अंतराल, विन्यास की चौड़ाइयाँ — क्योंकि वह मूल से नापा जाता है और कभी संचित नहीं होता। हर उस वस्तु के लिए em जिसे उस पाठ के पीछे चलना चाहिए जिसमें वह बैठी है: बटन की भीतरी जगह, आइकन के बगल का अंतराल, उद्धरण की हाशियाई दूरी। सामान्य भूल यह है कि em में नापे गए तत्व एक-दूसरे में रखे जाएँ: 1.2 em के भीतर 1.2 em बन जाता है 1.44, फिर 1.73, यहाँ तक कि पृष्ठ के नीचे का पाठ अभीष्ट से दुगुना हो जाता है।
क्या उत्तर सटीक है?
जहाँ दोनों इकाइयाँ एक-दूसरे से पूर्ण संख्याओं में परिभाषित हैं, वहाँ हाँ — पृष्ठ यह बात संख्या के ऊपर कहता है, और एकमात्र गोलाई इसमें है कि कितने अंक दिखाए जाएँ। जहाँ अनुपात का दशमलव समाप्त नहीं होता, पृष्ठ बारह सार्थक अंक दिखाता है और कहता है कि संबंध सन्निकट है, कुछ और होने का ढोंग नहीं करता।
क्या मेरा लिखा हुआ मेरे उपकरण से बाहर जाता है?
नहीं। गणना आपके ही ब्राउज़र में होती है; कुछ भी अपलोड नहीं होता, और करने के लिए कोई सर्वर है भी नहीं। पृष्ठ एक बार खुल जाने पर नेटवर्क बंद होने पर भी चलता है।
आप px को em में क्यों बदलते हैं
Em CSS की सबसे पुरानी सापेक्ष इकाई है और वही जो सबसे अधिक बहस पैदा करती है। आपके पास डिज़ाइन फ़ाइल से पिक्सेल में एक आकार है, बटन पर 20 px की पैडिंग, आइकन के बग़ल में 14 px की जगह, शीर्षक के लिए 36 px, और आप उसे em में चाहते हैं, ताकि वह उस पाठ का अनुसरण करे जिसका वह है। जब आप px को em में बदलते हैं तो आप एक विशेष प्रश्न पूछ रहे होते हैं: यह वर्तमान फ़ॉन्ट आकार का कितना गुना है? उत्तर एक ऐसी संख्या पर निर्भर करता है जिसका अनुमान पृष्ठ नहीं लगा सकता, यानी वहाँ लागू फ़ॉन्ट आकार जहाँ मान उपयोग होता है, इसलिए कन्वर्टर उस संख्या को एक क्षेत्र में रखता है और उसे खुले तौर पर उपयोग करता है।
आकार को em में लिखने का कारण यह है कि जो चीज़ें पाठ की हैं उन्हें पाठ के साथ बढ़ना चाहिए। बटन के भीतर की पैडिंग बड़ी होनी चाहिए जब बटन का लेबल बड़ा हो। आइकन और उसके कैप्शन के बीच का अंतर चौड़ा होना चाहिए जब कैप्शन हो। शीर्षक का निचला मार्जिन शीर्षक के अनुपात में रहना चाहिए। इन सभी मामलों में फ़ॉन्ट आकार बदलते ही पिक्सेल मान ग़लत हो जाता है, और em मान किसी भी आकार पर सही है। em के पक्ष में पूरा तर्क यही है, और यह एक मज़बूत तर्क है।
गणना आपके ब्राउज़र में होती है, और कुछ अपलोड नहीं होता। नीचे आपको सूत्र, em को rem से अधिक सावधानी क्यों चाहिए, आश्चर्यजनक आकार पैदा करने वाला नेस्टिंग का जाल, वे जगहें जहाँ em सही इकाई है, और असली स्टाइलशीट में em और rem के बीच चुनने की विधि मिलेगी।
सूत्र और आधार
em बराबर px भाग फ़ॉन्ट आकार
सूत्र एक भाग है: em = px ÷ आधार। 16 px के आधार के साथ 24 px 1.5 em बन जाता है, 8 px 0.5 em बन जाता है और 20 px 1.25 em बन जाता है। पृष्ठ परिणाम के बग़ल में आधार दिखाता है, जैसे 24 px = 1.5 em (16 px), ताकि आप देख सकें कि क्या मान लिया गया था। गणित rem जैसा ही है। अर्थ भिन्न है।
आधार क्या है
rem के लिए आधार रूट तत्व का फ़ॉन्ट आकार है। em के लिए वह उस तत्व का फ़ॉन्ट आकार है जहाँ मान उपयोग होता है, या, font-size गुण के लिए ही, पैरेंट का। इसीलिए em का कोई एक उत्तर नहीं: वही स्टाइलशीट मान अलग-अलग जगहों पर अलग पिक्सेल आकार का अर्थ रखता है। अगर आप ऐसे बटन की पैडिंग बदल रहे हैं जिसका पाठ 14 px है, तो आधार के रूप में 14 टाइप कीजिए। अगर आप 32 px के शीर्षक का मार्जिन बदल रहे हैं, तो 32 टाइप कीजिए।
जब आप न जानें तो डिफ़ॉल्ट
अगर आपको बस मोटा आँकड़ा चाहिए, तो आधार को 16 पर रहने दीजिए, उस ब्राउज़र में साधारण पाठ का आकार जिसे किसी ने बदला नहीं। परिणाम सामान्य मुख्य-पाठ के खंड के लिए सही है, और यह आपको अनुपात का बोध देता है भले ही तत्व का आकार अलग निकले।
रूपांतरण क्या रखता है और क्या नहीं रख सकता
यह पाठ से अनुपात रखता है
परिणाम उस फ़ॉन्ट आकार के सापेक्ष अनुपात है जो वहाँ लागू है जहाँ मान उपयोग होता है। em में लिखी जगह अपने बग़ल के पाठ के साथ बढ़ती और घटती है, और शब्दों के आसपास की जगह को ठीक ऐसा ही व्यवहार करना चाहिए।
यह आपको पूरे पृष्ठ के लिए एक संख्या नहीं दे सकता
यह वह बात है जिससे सावधान रहना है। em तत्व के अपने फ़ॉन्ट आकार के सापेक्ष है, या font-size के लिए उसके पैरेंट के, रूट के नहीं। इसलिए पृष्ठ के लिए कोई एक उत्तर नहीं: वही 1.5 em 16 px के तत्व के भीतर 24 px है और 24 px वाले के भीतर 36 px, और em के भीतर em गुणा होता है। पृष्ठ पर आँकड़ा क्षेत्र के आधार के लिए सही है और किसी और के लिए नहीं। अगर आप एक ऐसी संख्या चाहते हैं जो हर जगह टिके, तो rem उसी के लिए है। तुलना के लिए px को rem में बदलिए और देखिए कि वही पिक्सेल मान कैसे व्यवहार करता है।
पूर्णांकन
16 से भाग कई आकारों के लिए साफ़ मान देता है और अन्य के लिए आवर्ती दशमलव। 0.8125 em जैसा मान स्टाइलशीट में ठीक है, पर अगर सटीक आकार मायने नहीं रखता तो आप 0.8 या 0.85 में पूर्णांकित करना पसंद कर सकते हैं। जहाँ परिशुद्धता मायने रखे वहाँ पूरा आँकड़ा रखिए।
नेस्टिंग का जाल
em कैसे चक्रवृद्धि होता है
मान लीजिए किसी सूची में font-size: 0.875em है और उसकी मदों में भी font-size: 0.875em है। सूची अपने पैरेंट का 87.5% है। हर मद सूची का 87.5% है, जो पैरेंट का लगभग 76.6% है। मद के भीतर नेस्ट की गई सूची फिर सिकुड़ती है, लगभग 67% तक। तीन स्तरों के बाद पाठ बहुत छोटा है, और किसी ने यह जान-बूझकर नहीं लिखा। यही है यह कहने का अर्थ कि em चक्रवृद्धि होता है।
जब आप px को em में बदलते हैं तो यह क्यों मायने रखता है
अगर आप font-size के लिए पिक्सेल मान को em में बदलते हैं, तो आपको जो आधार उपयोग करना है वह पैरेंट का फ़ॉन्ट आकार है, तत्व का अपना नहीं। कई ग़लतियाँ ग़लत वाले के उपयोग से आती हैं। अन्य गुणों, जैसे padding और margin, के लिए आधार तत्व का अपना फ़ॉन्ट आकार है। नियम कहना आसान है और भूलना आसान: font-size ऊपर देखता है, बाक़ी सब अपने को।
आश्चर्यों से कैसे बचें
पाठ का अनुसरण करने वाली जगह के लिए em और फ़ॉन्ट आकारों के लिए rem उपयोग कीजिए। इस तरह फ़ॉन्ट आकार कभी चक्रवृद्धि नहीं होते, क्योंकि वे रूट को संदर्भित करते हैं, और जगह अब भी अपने पाठ का अनुसरण करती है। यही वह संयोजन है जिस पर अधिकांश आधुनिक स्टाइलशीट बसती हैं।
सामान्य आकार
पृष्ठ के नीचे की तालिका
कन्वर्टर के नीचे आपके तय किए आधार पर सामान्य आकारों की तालिका है: 8 px 0.5 em है, 10 px 0.625 है, 12 px 0.75 है, 14 px 0.875 है, 16 px 1 है, 18 px 1.125 है, 20 px 1.25 है, 24 px 1.5 है, 32 px 2 है, 48 px 3 है और 64 px 4 है। 16 के आधार पर ये वही संख्याएँ हैं जो rem के लिए हैं, इसीलिए लोग दोनों को उलझाते हैं। अंतर इसमें है कि 16 किसके लिए खड़ा है।
तत्व से मिलाने के लिए आधार बदलना
अगर आप छोटे बटन के लिए आधार को 14 पर सेट करते हैं, तो तालिका बदल जाती है: 14 px अब 1 em है, 7 px 0.5 em है और 21 px 1.5 em है। आज़माइए, और आप देखेंगे कि 1.5 em की पैडिंग 14 px के बटन में 18 px वाले बटन से भिन्न पिक्सेल आकार की होती है, और यह उपयोगी क्यों है।
यहाँ px को em में कैसे बदलें
पिक्सेल मान टाइप कीजिए
पहले क्षेत्र में पिक्सेल में आकार डालिए। दशमलव स्वीकार हैं।
वह फ़ॉन्ट आकार सेट कीजिए जिसे em संदर्भित करता है
तत्व का फ़ॉन्ट आकार टाइप कीजिए, या उसके पैरेंट का अगर आप font-size बदल रहे हैं। अगर अनिश्चित हों, तो 16 रहने दीजिए और परिणाम को अनुमान मानिए।
em मान कॉपी कीजिए
अपने CSS में आँकड़े को उसकी इकाई के साथ उपयोग कीजिए, जैसे padding: 1.25em। इकाई के बिना संख्या अधिकांश गुणों के लिए अमान्य है।
ये इकाइयाँ कहाँ से आती हैं
धातु के टाइप में em
em वेब से पुराना है। धातु के टाइप में वह ढले हुए ब्लॉक की चौड़ाई था, बड़े अक्षर M के नाम पर, और छपी पंक्ति में क्षैतिज स्थान की स्वाभाविक इकाई था। टाइपोग्राफ़र आज भी em डैश और em स्पेस की बात करते हैं। CSS में विचार अधिक ढीले रूप में बचा है: एक em वर्तमान फ़ॉन्ट का आकार है।
पिक्सेल और rem
CSS पिक्सेल आरामदायक पढ़ने की दूरी पर देखी गई लगभग 1/96 इंच की संदर्भ लंबाई है, आपकी स्क्रीन का कोई बिंदु नहीं। rem को इसलिए जोड़ा गया कि डेवलपरों को ऐसी इकाई मिले जो सापेक्ष हो पर कभी चक्रवृद्धि न हो: वह रूट तत्व का em है। इनके बीच पिक्सेल, em और rem तीन ज़रूरतें ढकते हैं: निश्चित आकार, पाठ के सापेक्ष आकार, और पृष्ठ के सापेक्ष आकार।
जहाँ em सही विकल्प है
बटनों और फ़ॉर्म क्षेत्रों के भीतर की पैडिंग
padding: 0.5em 1em वाला बटन किसी भी पाठ आकार पर अनुपात में वैसा ही दिखता है। लेबल को बड़ा कीजिए और पूरा बटन उसके साथ बढ़ता है, जो आप उस घटक से चाहते हैं जो टूलबार में और हीरो बैनर में उपयोग हो सकता है।
आइकनों के बग़ल में जगह
जिस आइकन के बाद कैप्शन है उसे ऐसा अंतर चाहिए जो कैप्शन के साथ पैमाने पर चढ़े। 0.4em का मार्जिन यह करता है; 6px का मार्जिन नहीं।
शीर्षकों और अनुच्छेदों के आसपास मार्जिन
दस्तावेज़ में ऊर्ध्वाधर लय रखना आसान है जब अनुच्छेद की जगह em में हो, क्योंकि वह अनुच्छेद के आकार का अनुसरण करती है। शीर्षक का em में मार्जिन अनुपात में रहता है जब शीर्षक अलग ब्रेकपॉइंट पर आकार बदलता है।
मीडिया क्वेरी
em में लिखे ब्रेकपॉइंट पाठक के पाठ आकार का जवाब देते हैं, इसलिए जिसने पाठ बड़ा किया है उसके लिए लेआउट अपने संकरे रूप में जल्दी बदल जाता है। मीडिया क्वेरी में em ब्राउज़र के डिफ़ॉल्ट को संदर्भित करता है, किसी तत्व को नहीं, इसलिए वह चक्रवृद्धि नहीं होता।
px को em में बदलते समय के जाल
ग़लत आधार उपयोग करना
सबसे आम त्रुटि। font-size के लिए पैरेंट का आकार उपयोग कीजिए; बाक़ी सबके लिए तत्व का अपना। आधार टाइप करने से पहले जाँचिए कि आप कौन-सा गुण बदल रहे हैं।
भूल जाना कि पैरेंट भी em में हो सकता है
अगर पैरेंट का फ़ॉन्ट आकार स्वयं em में है, तो सही आकार जानने के लिए आपको श्रृंखला के ऊपर चलना पड़ता है। जब स्टाइलशीट जटिल हो जाए, तो फ़ॉन्ट आकारों को rem में बदल दीजिए और em को जगह के लिए रखिए।
पूरे घटक के लिए एक आँकड़े की अपेक्षा
जिस घटक में अलग-अलग आकार का पाठ है उसके हिस्सों के लिए कोई एक em मान नहीं। हर हिस्से को उसके अपने आधार के सामने बदलिए।
एक ही गुण के लिए em और rem मिलाना
1em के मार्जिन के बग़ल में 1rem की पैडिंग वैध है और अक्सर भ्रमित करने वाली। कोई नियम चुनिए, जैसे फ़ॉन्ट आकारों के लिए rem और जगह के लिए em, और उस पर टिके रहिए।
बदलने से पहले लोग जो प्रश्न पूछते हैं
16 px कितने em है?
एक, अगर लागू फ़ॉन्ट आकार 16 px है। अगर तत्व का फ़ॉन्ट आकार 20 px है, तो 16 px 0.8 em है।
क्या em, rem से बेहतर है?
कोई भी बेहतर नहीं। rem फ़ॉन्ट आकारों और वैश्विक लेआउट के लिए बेहतर है। em उस जगह के लिए बेहतर है जिसे अपने पाठ का अनुसरण करना चाहिए।
मेरी पैडिंग अपेक्षा से बड़ी क्यों है?
क्योंकि वह तत्व के फ़ॉन्ट आकार के सापेक्ष है, जो आपकी मान्यता से बड़ा हो सकता है। ब्राउज़र के डेवलपर टूल में गणना किया फ़ॉन्ट आकार जाँचिए।
क्या मैं दशमलव उपयोग कर सकता हूँ?
हाँ। 0.625em और 1.333em जैसे मान सामान्य हैं।
क्या मेरी संख्या अपलोड होती है?
नहीं। गणित आपके ब्राउज़र में चलता है और कुछ कहीं नहीं भेजा जाता।
मैं वापस कैसे जाऊँ?
em से px के साथ, जो भाग देने की जगह गुणा करता है।
px को em में बदलते समय समझदारी से चुनना
तय कीजिए कि मान किसका है
अगर वह पाठ का है, तो em सही है। अगर वह पृष्ठ का है, जैसे स्तंभ की चौड़ाई या खंड का अंतर, तो rem या व्यूपोर्ट इकाई बेहतर बैठती है। px से vw आकार को स्क्रीन की चौड़ाई के हिस्से के रूप में व्यक्त करता है।
टिप्पणी में इरादा लिखिए
padding: 0.75em 1.25em; /* 12px 20px at 16px */ जैसी पंक्ति तर्क को दिखाई देने योग्य बनाती है। जब फ़ॉन्ट आकार बाद में बदले, तो आप जानेंगे कि संख्याओं का क्या अर्थ था।
घटक का फ़ॉन्ट आकार एक जगह रखिए
घटक के रूट तत्व पर फ़ॉन्ट आकार सेट कीजिए और भीतर की हर चीज़ को उसे संदर्भित करने दीजिए। तब भीतर के em मानों का घटक में हर जगह एक ही अर्थ है, और आप एकल आधार के सामने px को em में बदल सकते हैं।
px को em में बदलते समय अच्छी आदतें
एक बार में एक घटक के px को em में बदलिए
पूरी स्टाइलशीट के लिए एक साथ px को em में बदलने की कोशिश मत कीजिए। एक अकेला घटक लीजिए, जैसे कार्ड या बटन, उसका फ़ॉन्ट आकार तय कीजिए, और उस आकार के सामने उसके हर जगह-मान को बदलिए। जब घटक पूरा हो जाए, तो उसे दो या तीन पाठ आकारों पर परखिए। फिर अगले पर जाइए।
विषम मानों के लिए कैलकुलेटर उपयोग कीजिए, गोल के लिए नहीं
8, 16 और 24 पिक्सेल जैसे मान 16 के आधार पर साफ़ em संख्याओं में बदलते हैं। 22 या 13 जैसे विषम मान लंबे दशमलव देते हैं। जब आप इनके लिए px को em में बदलें, तो तय कीजिए कि डिज़ाइन को सचमुच सटीक आँकड़ा चाहिए या निकटतम गोल em मान उतना ही अच्छा होगा। डिज़ाइनर अक्सर पूर्णांकित करने से ख़ुश होते हैं, और साफ़ स्टाइलशीट का रखरखाव आसान है।
आधार का रिकॉर्ड रखिए
हर em मान के बग़ल में एक छोटी टिप्पणी, जो बताए कि आधार क्या था, अगले व्यक्ति की मदद करती है। अगर कोई बाद में घटक का फ़ॉन्ट आकार बदलता है, तो वह जानेगा कि जगह उसका अनुसरण डिज़ाइन से करती है, संयोग से नहीं। इसे एक बार लिख देना उस समय के लायक़ है जो लगता है।
rem समतुल्य से तुलना कीजिए
अगर आप अनिश्चित हैं कि मान के लिए em बैठता है या rem, तो px को em और rem दोनों में बदलिए और पूछिए कि पाठ आकार बदलने पर क्या होना चाहिए। अगर मान को तत्व के अपने पाठ का अनुसरण करना चाहिए, तो em लीजिए। अगर पृष्ठ का, तो rem।
संबंधित कन्वर्टर
उपकरणों का वही परिवार पड़ोसी रूपांतरण ढकता है। पिक्सेल पर लौटने के लिए em से px उपयोग कीजिए। रूट के सापेक्ष आकारों के लिए px से rem और rem से px हैं, और स्क्रीन के सापेक्ष आकारों के लिए px से vw और vw से px। उसी स्टाइलशीट के रंगों के लिए HEX से RGB और HEX से HSL संकेतन सँभालते हैं।
एक हल किया उदाहरण
मान लीजिए बटन का लेबल 14 px है और डिज़ाइन बटन को 10 px की ऊर्ध्वाधर पैडिंग और 20 px की क्षैतिज पैडिंग देता है। आप आधार के रूप में 14 टाइप करते हैं, 10 टाइप करके 0.714 em पढ़ते हैं, 20 टाइप करके 1.429 em। स्टाइलशीट में आप padding: 0.714em 1.429em लिखते हैं। जब वही बटन 18 px के लेबल वाले हीरो में उपयोग होता है, तो पैडिंग अनुपात में 12.9 px और 25.7 px हो जाती है। अगर आपने 10px और 20px लिखा होता, तो बटन बड़े पाठ के आसपास पतला दिखता।
एक संक्षिप्त जाँच-सूची
बदलने से पहले
तय कीजिए कि मान किस गुण का है, और वह फ़ॉन्ट आकार खोजिए जिसके सापेक्ष वह होना चाहिए।
बदलते समय
पिक्सेल मान और सही आधार टाइप कीजिए, और em आँकड़े को इकाई के साथ कॉपी कीजिए।
बदलने के बाद
ब्राउज़र में घटक का फ़ॉन्ट आकार बदलिए और जाँचिए कि जगह अनुसरण करती है। चक्रवृद्धि होने वाले नेस्टेड em मान खोजिए।
आम ग़लतियाँ
पैडिंग के आधार के रूप में रूट का आकार उपयोग करना
वह rem का काम है। em तत्व के अपने फ़ॉन्ट आकार को संदर्भित करता है।
हर फ़ॉन्ट आकार के लिए em उपयोग करना
नेस्टेड em फ़ॉन्ट आकार चक्रवृद्धि होते हैं और आपको चौंकाते हैं। फ़ॉन्ट आकारों के लिए rem उपयोग कीजिए।
दिखने में साफ़ पर ग़लत संख्या में पूर्णांकन
बड़े फ़ॉन्ट से गुणा करने पर 1.43, 1.5 जैसा नहीं है। पर्याप्त अंक रखिए।
आपकी संख्याएँ आपके उपकरण पर रहती हैं
गणना स्थानीय रूप से होती है। आपके मान आपके अपने ब्राउज़र द्वारा उपयोग होते हैं और कुछ कहीं नहीं भेजा जाता। बाद में हटाने को कुछ नहीं और बनाने को कोई खाता नहीं। px को em में बदलने का यही सीधा तरीक़ा है।
सारांश
यहाँ px को em में बदलने के लिए, पिक्सेल में आकार और वह फ़ॉन्ट आकार टाइप कीजिए जिसके सापेक्ष वह है, और सूत्र em = px ÷ आधार से परिणाम तुरंत पढ़िए। रूपांतरण उस फ़ॉन्ट आकार के सापेक्ष अनुपात रखता है जो वहाँ लागू है जहाँ मान उपयोग होता है। यह पृष्ठ के लिए एकल उत्तर नहीं दे सकता: em तत्व के अपने फ़ॉन्ट आकार के सापेक्ष है, या font-size के लिए पैरेंट के, इसलिए वही 1.5 em 16 px के तत्व के भीतर 24 px है और 24 px वाले के भीतर 36 px, और em के भीतर em गुणा होता है। ऐसी संख्या के लिए जो हर जगह टिके, rem उपयोग कीजिए। कुछ अपलोड नहीं होता।