HTML में, कभी-कभी हमें स्पेस बनाने की आवश्यकता होती है, और यह स्पेसबार का उपयोग करके इसे बनाने जितना आसान नहीं है। यह विशेष रूप से सच है यदि हमें एक पंक्ति में कई स्पेस या टैब चाहिए - HTML उन कई स्पेस को एक स्पेस में संकुचित कर देता है। यहीं HTML एंटिटीज़ काम आती हैं। इस लेख में, हम उन विभिन्न HTML एंटिटीज़ को देखते हैं जो हमें सभी अलग-अलग आकार के स्पेस बनाने की अनुमति देती हैं।
HTML एलिमेंट्स में चार मुख्य प्रकार के स्पेस हैं जिनके साथ हम काम कर सकते हैं: थिन स्पेस, नॉन-ब्रेकिंग स्पेस, एन स्पेस, और एम स्पेस। नीचे दिए गए कोड एडिटर में चार प्रकारों के बीच आकार में अंतर को रेखांकित किया गया है:
<!DOCTYPE html> <!-- <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title></title> <style> span { background: pink; } <style> body { font-family: Arial } </style> </head> <body style="font-family:Arial;"> <h1>HTML में स्पेस एंटिटीज़ के आकार में अंतर</h1> <!-- वाक्यों की शुरुआत में --> <p style="font-size:16px;text-decoration:underline;font-weight:bold;"> वाक्यों की शुरुआत</p> <p><span> </span>मैं एक वाक्य हूँ।</p> <p><span> </span>मैं एक वाक्य हूँ।</p> <p><span> </span>मैं एक वाक्य हूँ।</p> <p><span> </span>मैं एक वाक्य हूँ।</p> <!-- शब्दों के बीच में --> <p style="font-size:16px;text-decoration:underline;font-weight:bold;"> शब्दों के बीच में</p> <p>मैं<span> </span>हूँ<span> </span>एक<span> </span>वाक्य।</p> <p>मैं<span> </span>हूँ<span> </span>एक<span> </span>वाक्य।</p> <p>मैं<span> </span>हूँ<span> </span>एक<span> </span>वाक्य।</p> <p>मैं<span> </span>हूँ<span> </span>एक<span> </span>वाक्य।</p> </body> </html>
विभिन्न स्पेस प्रकार विभिन्न उद्देश्यों की पूर्ति कर सकते हैं। इस कोड उदाहरण में, हम स्पेसबार का उपयोग करके एक मानक स्पेस और HTML एंटिटी का उपयोग करने के बीच अंतर को देखते हैं।
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>repl.it</title> </head> <body style="font-family:Arial;"> <div> <strong>nbsp; उदाहरण का उपयोग</strong> <br/> <br/> <div style="width:50px;height: 50px;border:1px solid red;margin:10px;">Dr. John Doe</div> <div style="width:50px;height: 50px; border: 1px solid red;margin:10px;">Dr. John Doe</div> <div style="width:50px;height: 50px;border:1px solid red;margin:10px;">Reno, NV</div> <div style="width:50px;height: 50px; border: 1px solid red;margin:10px;">Reno, NV</div> </div> <div> <strong>emsp; उदाहरण का उपयोग</strong> <br/> <br/> <div style="border:1px solid red;margin:10px;"> <p>यहाँ कुछ उद्धरण हैं।</p> <p> <em> —होना या न होना, यही प्रश्न है...</em></p> <p> <em> —इस सब से ऊपर: अपने प्रति सच्चे रहो...</em></p> <p> <em> —नाम में क्या रखा है? जिसे हम गुलाब कहते हैं किसी अन्य नाम से भी उतना ही मीठा महकेगा...</em></p> </div> <div style="border: 1px solid red;margin:10px;"> <p>यहाँ कुछ उद्धरण हैं।</p> <p> <em> —होना या न होना, यही प्रश्न है...</em></p> <p> <em> —इस सब से ऊपर: अपने प्रति सच्चे रहो...</em></p> <p> <em> —नाम में क्या रखा है? जिसे हम गुलाब कहते हैं किसी अन्य नाम से भी उतना ही मीठा महकेगा...</em></p> </div> </div> </body>
जब आपके पास कोई वाक्यांश, नाम या संख्या हो जो अगली पंक्ति में नहीं लपेटा जाना चाहिए, तो nbsp कैरेक्टर एंटिटी का उपयोग करें। जब आपके पास टेक्स्ट का एक ब्लॉक हो जिसे उसकी अपनी पंक्ति या पैराग्राफ में जोर देने की आवश्यकता हो, तो emsp कैरेक्टर एंटिटी का उपयोग करें।
यह तालिका उन कोड्स को रेखांकित करती है जिनका उपयोग विभिन्न आकार के स्पेस के साथ किया जा सकता है:
इनमें से कोई भी कोड उनके संबंधित स्पेस आकार/प्रकार के लिए काम करता है। एंटिटी नामों के लिए ब्राउज़र समर्थन काफी व्यापक है, लेकिन अगर ऐसा नहीं होता है, तो हेक्स और डेस कोड भी काम करते हैं।
