परिचय

आधुनिक वेब डिज़ाइन की मुख्य विशेषताएँ इसकी लचीलापन और प्रतिक्रियाशीलता हैं। यह सुनिश्चित करने के लिए कि वेबसाइटें किसी भी प्रकार की मशीन में सही ढंग से प्रदर्शित हों, PX से EM कनवर्टर का उपयोग करके निश्चित पिक्सेल (px) मान को स्केलेबल EM मानों में बदला जा सकता है - और इससे कोई फर्क नहीं पड़ता कि आप फ़ॉन्ट आकार, पैडिंग या मार्जिन बदल रहे हैं या पिक्सेल को EM में स्थानांतरित कर रहे हैं, इसका मतलब है कि आपने जो कुछ भी बनाया है, उसे उपयोगकर्ता की इच्छानुसार अन्य स्क्रीन रिज़ॉल्यूशन में आसानी से स्केल किया जा सकता है।.

यह समय बचाने वाला है, जो न केवल आपका समय बचाता है, बल्कि मैनुअल में की जाने वाली गलतियों की संख्या को भी कम करता है, और यह आपके CSS के लिए भी प्रासंगिक है। आपको ऐसी गणनाओं का कुछ हिस्सा खुद नहीं करना पड़ता और जब आप अपना पिक्सेल मान टाइप कर लेते हैं, तो एप्लिकेशन स्वचालित रूप से आपको उस बेस फ़ॉन्ट आकार के अनुसार आवश्यक EM मान प्रदान कर देगा जिसका आप उपयोग करना चाहेंगे (16 अब तक का सबसे अधिक इस्तेमाल किया जाने वाला बेस फ़ॉन्ट आकार है)।.

CSS में PX और EM इकाइयाँ क्या हैं?

PX (पिक्सेल) क्या है?

वेब डिज़ाइन एक सापेक्ष माप है जिसे पिक्सेल (px) इकाई में मापा जाता है। यह किसी भी समय स्क्रीन का पूर्ण आकार, यानी 100 px का बटन भी प्रदान करता है, चाहे कोई भी डिवाइस इस्तेमाल कर रहा हो और ज़ूम आवर्धन कितना भी हो।.

पिक्सेल सटीक नहीं हैं, लेकिन समायोज्य हैं। निश्चित पिक्सेल मान बहु-डिवाइस मामले में अस्थिर लेआउट उत्पन्न करेंगे, जो कि स्मार्ट फ़ोन और उच्च-स्तरीय मॉनिटर के मामले में होगा, और कम पठनीयता मान उत्पन्न करेंगे।.

EM (सापेक्ष इकाई) क्या है?

ईएम (em) इकाई एक अन्य सीएसएस इकाई है जिसे सापेक्ष इकाई के रूप में गिना जा सकता है और मूल तत्व का फ़ॉन्ट आकार बड़ा होने पर (या तत्व मूल तत्व का अनुसरण करता है) संशोधित किया जा सकता है।.

उदाहरण के लिए:

प्रयुक्त फ़ॉन्ट आकार 16px है,

1em =16px. 2em = 32px 0.75em = 12px

EM सापेक्षता इसे एक प्रभावी डिज़ाइन बनाती है जिसमें प्रतिक्रियाशील और सुलभ डिज़ाइन होता है। EM इकाइयाँ ब्राउज़र या उपयोगकर्ता के ज़ूम के साथ प्रोग्राम की जाती हैं, जो बड़े फ़ॉन्ट्स के प्रति और भी अधिक संवेदनशील होते हैं, जिससे उपयोगकर्ताओं को समान स्पष्टता और डिज़ाइन मिलता है।.

PX के स्थान पर EM का उपयोग क्यों करें?

• EM, PX का स्थान लेता है: तूने जो चाहा, वह बेच दिया है:
• निजी: यह अन्य शो और उपकरणों से अलग नहीं है।.
• पठनीय: उपयोगकर्ताओं के लिए फ़ॉन्ट में अधिक खाद्य और पठनीय है।.
• पैमाना: सदस्यता स्थिर है.
• अनुकूलन योग्य: पहले से मौजूद ढाँचों पर आदर्श टेलविंड, बूटस्ट्रैप या सीएसएस ग्रिड।.

कहने का तात्पर्य यह है कि, ईएम मान अब आपको बताएंगे कि आप क्या बना रहे हैं और क्या डिजाइन कर रहे हैं, क्या उपयोग करना सुविधाजनक है, फिक्स पिक्सेल की कौन सी संरचना किसी विशेष अवसर पर इतनी सुविधाजनक नहीं है।.

PX से EM रूपांतरण सूत्र

पिक्सेल को EM में डिक्रिप्शन करने में प्रयुक्त होने वाला सरलतम समीकरण है:

em = px / आधार फ़ॉन्ट आकार

The मानक फ़ॉन्ट अधिकांश वेब ब्राउज़रों का 16 पीएक्स.

उदाहरण:

32 पिक्सेल से EM (16 का आधार फ़ॉन्ट उपयोग करें):

32 ÷ 16 = 2em

इसलिए, 32px बराबर 2em.

PX को EM कनवर्टर टूल में शामिल किया जाएगा

यदि CSS फाइलें बहुत बड़ी हो जाएं तो रूपांतरण प्रक्रिया के दौरान यह उपयोगकर्ता के अनुकूल भी नहीं है।. PX से EM रूपांतरणक में किया जा सकता है toolsmate.online और वह भी बहुत कम परेशानी के साथ, निम्नलिखित तरीके से:

• साइट पर PX से EM कनवर्टर टूल को सक्रिय करें।.
• इनपुट पर आवश्यक पिक्सेल की संख्या वैकल्पिक होनी चाहिए (जैसे 24 पिक्सेल) जब तक कि अन्यथा न हो।.
• चुनें या डिफ़ॉल्ट फ़ॉन्ट आकार = 16pix चुनें.
• टूल पर संशोधित करें का चयन करें या इसे छोड़ दें।.
• अपने सीएसएस कोड में अपना निष्कर्ष (EM) डालें।.

उदाहरण रूपांतरण

इनपुट: 24पिक्सल

आधार फ़ॉन्ट आकार: 16पिक्सल

परिणाम:

24 ÷ 16 = 1.5em

आउटपुट: 1.5em

बस! त्वरित, सरल और सटीक।.

A PX से EM कनवर्टर के आउटसोर्सिंग लाभ।.

1. समय और प्रयास की बचत होती है

इतनी बड़ी संख्या में पिक्सेल मानों को संशोधित करना एक कष्टदायक प्रक्रिया है। यह उन उपकरणों में से एक है जिनका उपयोग गणना के तुरंत उत्पादन में किया जाता है और इस प्रकार आपको गणनाओं के बारे में सोचने की ज़रूरत नहीं होती, बल्कि आप डिज़ाइनिंग पर ध्यान केंद्रित करते हैं।.

2. अंकगणितीय त्रुटियों से बचें।.

किसी भी रूप में रूपांतरण, यहाँ तक कि मैन्युअल रूप से किया गया रूपांतरण भी, अधिकांशतः मानवीय त्रुटि के अधीन होता है। कंप्यूटर सिस्टम निश्चित हैं; सौ प्रतिशत सुनिश्चित।.

3. बड़े CSS प्रोजेक्ट्स के लिए बढ़िया

विशाल स्टाइल शीट नियमितता में पाई जाती हैं। कनवर्टर के कार्य के आकार, स्थान, टाइप और चीज़ों में कोई अंतर नहीं होता।.

4. कस्टम बेस फ़ॉन्ट आकार.

इसका डिज़ाइन या ब्रांड गैर-16px बेस फ़ॉन्ट (जैसे 18 या 20) की धारणा पर बनाए जाते हैं। कनवर्टर प्रोजेक्ट सेटअप के अनुसार बेस साइज़ को कॉन्फ़िगर करना संभव बना देगा।.

5. उत्तरदायित्व को बढ़ावा देता है.

यह कि सहज लेआउट स्थापित करना काफी सरल है और, आम तौर पर, उपयोगकर्ताओं के लिए वस्तुओं की अधिक पहुंच को ध्यान में रखना काफी आसान है, यह देखते हुए कि यह केवल EM इकाइयों का उपयोग किया जाता है, पिक्सेल का नहीं।.

वास्तविक दुनिया के उपयोग के मामले

1. उत्तरदायी टाइपोग्राफी

यह गतिशील आकार का पाठ है, इसलिए फ़ॉन्ट का आकार EM में हो सकता है।.

उदाहरण:

बॉडी { फ़ॉन्ट-आकार: 16px; } h1 { फ़ॉन्ट-आकार: 2em; /* बराबर 32px */ } p { फ़ॉन्ट-आकार: 1em; /* बराबर 16px */ }

इस तरह के कदम के कारण फ़ॉन्ट को 18px आकार में बदलने से संबंधित सभी चीजें स्वतः ही कम महत्व की हो जाती हैं।.

2. स्केलेबल लेआउट

डिज़ाइनर पैडिंग, लाइन की ऊँचाई और मार्जिन को रिस्पॉन्सिव बनाने के लिए EM का इस्तेमाल करते हैं। इससे स्क्रीन के बीच की दूरी पूरी तरह से सुविधाजनक हो जाती है।.

3. मोबाइल-प्रथम डिज़ाइन

ईएम मोबाइल फर्स्ट इकाइयों को इस तरह से बनाया गया है कि छोटी इकाइयां लेआउट को बाधित नहीं करती हैं।.

PX से EM रूपांतरण तालिका (बेस फ़ॉन्ट आकार = 16px)