Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> HTML

HTML सुपरस्क्रिप्ट और सबस्क्रिप्ट टेक्स्ट और इसका उपयोग कब करें

HTML `` टैग सुपरस्क्रिप्ट टेक्स्ट निर्दिष्ट करता है। यह वह टेक्स्ट है जो टेक्स्ट की एक लाइन के शीर्ष पर दिखाई देता है। `` टैग सबस्क्रिप्ट टेक्स्ट को दर्शाता है। यह वह टेक्स्ट है जो टेक्स्ट की एक लाइन के नीचे दिखाई देता है।

अधिकांश समय जब हम टेक्स्ट का सामना करते हैं, तो इसमें एक पारंपरिक बेसलाइन और x-height होती है।

इस लेख में अब तक का सभी टेक्स्ट एक बेसलाइन है। यह बेसलाइन मूल रूप से वह बिंदु है जहां एक अंडरलाइन दिखाई देगी अगर हम इसे एक के साथ फॉर्मेट करते हैं, और एक x-height। x-height वह काल्पनिक रेखा है जहां एक लोअरकेस अक्षर समाप्त होता है। इसका नाम लोअरकेस x से मिला है क्योंकि यह स्पेस को भरता है।

इस गाइड में, हम HTML में सबस्क्रिप्ट और सुपरस्क्रिप्ट को परिभाषित करने के तरीके के बारे में बात करने जा रहे हैं। हम इन टेक्स्ट फॉर्मेटिंग विषयों में से प्रत्येक का एक उदाहरण देखेंगे ताकि आप उन्हें अपने कोड में उपयोग करना सीख सकें।

सुपरस्क्रिप्ट और सबस्क्रिप्ट टेक्स्ट का उपयोग कब किया जाता है?

ऐसे समय होते हैं जब हम ऐसे वर्णों का उपयोग करना चाहेंगे जो सेट टेक्स्ट से आधा कैरेक्टर नीचे या ऊपर हों। सबस्क्रिप्ट वे वर्ण हैं जो टेक्स्ट से आधा कैरेक्टर नीचे सेट होते हैं। सुपरस्क्रिप्ट वे वर्ण हैं जो टेक्स्ट से आधा कैरेक्टर ऊपर सेट होते हैं।

वास्तविक दुनिया की सेटिंग में, हम इन वर्णों का उपयोग तब करते हैं जब हम गणितीय समीकरण, रासायनिक समीकरण, उद्धरण या फुटनोट्स का उपयोग कर रहे होते हैं, उदाहरण के लिए।

HTML सुपरटेक्स्ट

HTML में सुपर टेक्स्ट बनाने के लिए, `` टैग का उपयोग करें। यह टैग `` टैग के भीतर संलग्न किसी भी टेक्स्ट को लाइन के शीर्ष पर उठाता है। sup टैग का कोई टैग-विशिष्ट एट्रिब्यूट नहीं है।

आइए इस विधि के सिंटैक्स को देखें:

<p>4 <sup>2</sup> = 16</p>

हमने "2" कैरेक्टर को `` टैग के भीतर संलग्न किया है। यह "2" को सुपरस्क्रिप्ट में दिखाता है। हमारा कोड अब दिखाता है:

4 2 = 16

HTML सबटेक्स्ट

HTML `` कमांड सबटेक्स्ट को परिभाषित करता है। सबटेक्स्ट उस टेक्स्ट को संदर्भित करता है जो टेक्स्ट की एक लाइन के नीचे की ओर दिखाई देता है।

इस सिंटैक्स पर विचार करें:

<p>This is main text. <sub>3</sub></p>

हमारा कोड लौटाता है:

This is main text. 3

सुपर टेक्स्ट उदाहरण की तरह, हमने `` के लिए कोई टैग एट्रिब्यूट निर्दिष्ट नहीं किया है। टेक्स्ट को सबटेक्स्ट में ले जाने के लिए, हम उस टेक्स्ट को `` टैग के भीतर संलग्न करते हैं।

सबटेक्स्ट का उपयोग अक्सर आवर्त सारणी पर तत्व संख्या का वर्णन करने के लिए किया जाता है।

HTML सबटेक्स्ट और सुपरटेक्स्ट उदाहरण

आइए HTML वेब पेज पर `` और `` दोनों का एक उदाहरण देखें। निम्नलिखित कोड पर विचार करें:

<!DOCTYPE html> <html lang="en"> <head> <style> </style> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Superscript and Subscript</title> <style> sub { vertical-align: sub; font-size: smaller; } sup { vertical-align: super; font: smaller; } </style> </head> <body> <div style="text-align:center;" class="container"> <div> <h3>Superscript</h3> <span>E=MC<sup>2</sup></span> <br /> <span>1.7 x 10<sup>4</sup></span> </div> <div> <h3>Subscript</h3> <span>H<sub>2</sub>O</span> <br /> <span><sup>†1</sup>Ipsum, Lorem. Footnote example, 2020.</span> </div> </div> </body> </html>

जैसा कि आप देख सकते हैं, हम `` HTML एलिमेंट पर प्रभाव बनाने के लिए `` और `` सबस्क्रिप्ट टैग और सुपरस्क्रिप्ट टैग का उपयोग करते हैं। यह कुछ डिफ़ॉल्ट मानों के साथ आता है:

<style> sub { vertical-align: sub; font-size: smaller; } sup { vertical-align: super; font: smaller; } </style>

दोनों टैग HTML में हमारे लिए उपलब्ध इवेंट और ग्लोबल एट्रिब्यूट का उपयोग करते हैं। मूल रूप से इसका मतलब है कि आप इस पर एक इवेंट हैंडलर सेट कर सकते हैं यदि कोई टेक्स्ट पर क्लिक करता है।

इसके अलावा, आप एलिमेंट को कस्टमाइज़ करने के लिए नियमित HTML एट्रिब्यूट में से किसी का उपयोग कर सकते हैं। आप W3Schools द्वारा लिखी गई ग्लोबल एट्रिब्यूट सूची में हमारे लिए उपलब्ध नियमित HTML एट्रिब्यूट की सूची पा सकते हैं।


निष्कर्ष

HTML `` एलिमेंट टेक्स्ट के पैराग्राफ में सबटेक्स्ट जोड़ता है। सबटेक्स्ट टेक्स्ट की एक लाइन के नीचे दिखाई देता है। `` टेक्स्ट में सुपर टेक्स्ट जोड़ता है, जो टेक्स्ट की एक लाइन के शीर्ष पर दिखाई देता है।

बस! अब आप HTML में सुपरस्क्रिप्ट और सबस्क्रिप्ट सफलतापूर्वक बना सकते हैं।

क्या आप HTML के बारे में अधिक जानना चाहते हैं? विशेषज्ञ युक्तियों और शीर्ष ऑनलाइन पाठ्यक्रमों और पुस्तकों पर मार्गदर्शन के लिए हमारा पूर्ण HTML सीखने का गाइड देखें।

  1. गूगल डॉक्स में सबस्क्रिप्ट और सुपरस्क्रिप्ट का उपयोग कैसे करें गूगल डॉक्स में सबस्क्रिप्ट और सुपरस्क्रिप्ट का उपयोग कैसे करें

    आपके दिन-प्रतिदिन के अधिकांश लेखन के लिए, आपका टेक्स्ट एक लाइन पर बैठेगा। यह इतना स्पष्ट लगता है कि इसे नोट करने लायक नहीं है। हालांकि, कई बार आप टेक्स्ट का उपयोग लाइन के ऊपर या नीचे करेंगे। ये सबस्क्रिप्ट और सुपरस्क्रिप्ट कैरेक्टर हैं, और बटन के एक त्वरित जोड़े के माध्यम से, आप इन्हें गूगल डॉक्स म

  1. Google Docs में सबस्क्रिप्ट और सुपरस्क्रिप्ट मास्टर करें: त्वरित गाइड Google Docs में सबस्क्रिप्ट और सुपरस्क्रिप्ट मास्टर करें: त्वरित गाइड

    ऐसे कई बार होते हैं जब आपके दस्तावेज़ में कुछ शब्दों को टेक्स्ट की लाइन के शीर्ष पर छोटे अक्षरों (सुपरस्क्रिप्ट) या नीचे (सबस्क्रिप्ट) की आवश्यकता होती है। यह गणितीय टेक्स्ट, रासायनिक सूत्र, या तारीख जैसी सरल चीजों के लिए विशेष रूप से आम है। Google Docs में, सबस्क्रिप्ट और सुपरस्क्रिप्ट करने के ती

  1. Android पर कॉपी और पेस्ट में मास्टर करें: चरण-दर-चरण गाइड Android पर कॉपी और पेस्ट में मास्टर करें: चरण-दर-चरण गाइड

    पूरी दुनिया हमेशा लैरी टेस्लर की ऋणी रहेगी, जिन्होंने कट/कॉपी और पेस्ट का आविष्कार किया। यह सरल लेकिन अनिवार्य फंक्शन कंप्यूटिंग का एक अपरिहार्य हिस्सा है। हम कॉपी और पेस्ट के बिना एक डिजिटल दुनिया की कल्पना नहीं कर सकते। इसके बिना एक ही मैसेज को बार-बार टाइप करना न केवल निराशाजनक होता बल्कि कई डिज