लोड हो रहा है...

HTML टेक्स्ट फ़ॉर्मैटिंग

आप पहले ही style विशेषता से टेक्स्ट का रूप बदल चुके हैं। फ़ॉर्मेटिंग टैग एक अलग सवाल का जवाब देती हैं: टेक्स्ट का यह हिस्सा क्या मतलब रखता है? ज़रूरी चेतावनियाँ, बोली जैसा ज़ोर, हाइलाइट, संपादन, छोटे नोट और H₂O जैसी सूत्रें समर्पित HTML तत्वों में आती हैं। ब्राउज़र अक्सर उन्हें डिफ़ॉल्ट रूप से मोटा या तिरछा दिखाते हैं, लेकिन सहायक उपकरण और खोज प्रणालियाँ भी अर्थ का उपयोग कर सकती हैं — जो अकेले रंग नहीं देता।

HTML टेक्स्ट फ़ॉर्मेटिंग क्या है?

टेक्स्ट फ़ॉर्मेटिंग तत्व पैराग्राफ़ (या मिलते-जुलते टेक्स्ट) के अंदर किसी शब्द या वाक्यांश को लपेटकर भूमिका चिह्नित करते हैं: महत्व, ज़ोर, हाइलाइट, हटाना, जोड़ना और अधिक। ये इनलाइन तत्व हैं। ये p या h1 की तरह नया ब्लॉक शुरू नहीं करते। उन्हें ठीक उसी टेक्स्ट खंड के चारों ओर रखें जो वह भूमिका रखता है, फिर बंद करें ताकि वाक्य का बाकी हिस्सा सामान्य रह जाए।

सीधा उत्तर

अर्थ के लिए अर्थपूर्ण फ़ॉर्मेटिंग टैग इस्तेमाल करें: strong मज़बूत महत्व के लिए, em दबाव-ज़ोर के लिए (जैसे बोलते समय शब्द पर ज़ोर दें), mark प्रासंगिक हाइलाइट के लिए, small छोटे नोट या किनारे की टिप्पणी के लिए, del और ins हटाए या जोड़े गए टेक्स्ट के लिए, और sub / sup सबस्क्रिप्ट व सुपरस्क्रिप्ट के लिए। जब अर्थ मायने रखे तो इन टैग को प्राथमिकता दें। जब सिर्फ मोटा या तिरछा रूप चाहिए बिना अतिरिक्त अर्थ के, CSS इस्तेमाल करें — पिछली सत्र की इनलाइन style सोच सहित — न कि strong या em का गलत उपयोग।

टैग संदर्भ एक नज़र में

📊 सामान्य फ़ॉर्मेटिंग टैग

टैग सामान्य अर्थ डिफ़ॉल्ट रूप (अक्सर)
strong मज़बूत महत्व मोटा
em ज़ोर / दबाव तिरछा
mark हाइलाइट / प्रासंगिक पीला-सा बैकग्राउंड
small किनारे की टिप्पणी / छोटा नोट छोटा टेक्स्ट
del हटाया गया टेक्स्ट काटा हुआ
ins जोड़ा गया टेक्स्ट रेखांकित
sub सबस्क्रिप्ट नीचे छोटा टेक्स्ट
sup सुपरस्क्रिप्ट ऊपर छोटा टेक्स्ट

पहले strong और em

strong और em वह जोड़ी है जिसका आप सबसे अधिक उपयोग करेंगे। जब सामग्री महत्वपूर्ण हो तो strong लें — मुख्य शब्द, चेतावनी, टेक्स्ट में आवश्यक फ़ील्ड लेबल। जब बोलते समय आवाज़ बदलकर शब्द पर ज़ोर देंगे तो em लें। डिफ़ॉल्ट मोटा और तिरछा सिर्फ सामान्य प्रस्तुति है; अगर बाद में स्टाइलशीट रूप बदल दे तो भी टैग अर्थ रखती हैं।

महत्व और ज़ोर

html
HTML Code
<p>
<strong>अंतिम कीमत</strong> में कर शामिल है।
कृपया भुगतान करने से <em>पहले</em> रिफ़ंड नियम पढ़ें।
</p>

नमूने को पढ़ना

  • strong «अंतिम कीमत» को लपेटता है क्योंकि वह वाक्यांश वाक्य में महत्वपूर्ण है
  • em «पहले» को लपेटता है क्योंकि समय वह विचार है जिस पर ज़ोर है
  • दोनों टैग एक ही पैराग्राफ़ में हैं; वे p की जगह नहीं लेतीं
  • अगर सिर्फ नेवी रंग का टेक्स्ट चाहिए था बिना महत्व के अर्थ के, तो style (या बाद में CSS) बेहतर उपकरण होता

एक पैराग्राफ़ में और फ़ॉर्मेटिंग टैग

जब strong और em सहज लगें, हाइलाइट, संपादन, छोटे नोट और सूत्रों के लिए मदद जोड़ें। नेस्टिंग उथली रखें: सिर्फ उन्हीं शब्दों को लपेटें जिन्हें प्रत्येक भूमिका चाहिए।

कई फ़ॉर्मेटिंग टैग साथ

html
HTML Code
<p>
पानी H<sub>2</sub>O है। सुरक्षा नोट <strong>महत्वपूर्ण</strong> है।
कृपया इसे <em>ध्यान से</em> पढ़ें।
समयसीमा <del>शुक्रवार</del> से <ins>सोमवार</ins> हो गई।
नोट: <small>कीमतें बदल सकती हैं</small>।
खोज परिणाम: <mark>HTML</mark> फ़ॉर्मेटिंग।
क्षेत्रफल: 12<sup>2</sup> वर्ग मीटर।
</p>

हर मदद क्या कर रही है

  • sub पानी के सूत्र में «2» को नीचे ले जाता है; sup 12² में घातांक को ऊपर उठाता है
  • del और ins संपादन का निशान दिखाते हैं — पुराना मान बाहर, नया अंदर
  • small गौण छोटे नोट को चिह्नित करता है, मुख्य दावे को नहीं
  • mark प्रासंगिक परिणाम हाइलाइट करता है, खोज हाइलाइट जैसा
  • strong और em उसी पैराग्राफ़ में अभी भी महत्व और ज़ोर चिह्नित करते हैं
    हर वाक्य में हर टैग की ज़रूरत नहीं। वही चुनें जो आपके टेक्स्ट के असली अर्थ से मेल खाएँ।

अर्थ टैग बनाम केवल दिखावट वाला स्टाइल

पुराने पेज कभी-कभी मोटे और तिरछे रूप के लिए बिना मज़बूत अर्थ के b और i इस्तेमाल करते हैं। इस कोर्स में जब सामग्री महत्वपूर्ण हो तो strong और जब बोलते समय शब्द पर ज़ोर देंगे तो em को प्राथमिकता दें। जब सिर्फ दिखावट चाहिए तो CSS इस्तेमाल करें। यह आदत HTML को ईमानदार रखती है: फ़ॉर्मेटिंग टैग सामग्री बताती हैं, स्टाइलशीट प्रस्तुति बताती हैं।

अपने एडिटर में अभ्यास

  1. उत्पाद कीमत पर एक सामान्य पैराग्राफ़ लिखें।
  2. उत्पाद नाम को strong में लपेटें।
  3. एक चेतावनी शब्द को em में लपेटें।
  4. पुरानी कीमत को del और नई को ins से चिह्नित करें।
  5. वैकल्पिक: small से छोटा फ़ुटनोट-जैसा नोट, या sub / sup से सूत्र का टुकड़ा जोड़ें।
  6. सहेजें और पेज खोलें। पुष्टि करें कि टैग बंद हैं और अर्थ साफ़ पढ़ा जाता है।
  7. जानबूझकर एक अंत टैग छोड़ें, रिफ़्रेश करें, देखें बाकी पंक्ति कैसे स्टाइल रहती है, फिर ठीक करें।
    बिना बंद टैग का स्टाइल पैराग्राफ़ में «लीक» होते देखना सावधानीपूर्ण नेस्टिंग सिखाता है — सिर्फ सही नमूने कॉपी करने से तेज़।

गलतियाँ जो फ़ॉर्मेटिंग को कमज़ोर करती हैं

  • जब शब्द सच में महत्वपूर्ण हो तो सिर्फ style="font-weight: bold" — अर्थ के लिए strong प्राथमिकता दें
  • सिर्फ टेक्स्ट मोटा करने के लिए हर जगह strong — महत्व को पतला कर देता है
  • बिना वजह पाँच फ़ॉर्मेटिंग टैग एक-दूसरे में नेस्ट करना
  • असली स्क्रिप्ट (गणित, रसायन, फ़ुटनोट) की जगह सजावट के लिए sup / sub
  • अंत टैग भूलना ताकि बाकी पेज मोटा, तिरछा या हाइलाइट विरासत में ले ले
  • mark को असंबंधित पूरे पैराग्राफ़ के लिए सामान्य पीले पेंट की तरह मानना

सारांश

  • फ़ॉर्मेटिंग टैग टेक्स्ट के अंदर अर्थ जोड़ती हैं, सिर्फ सजावट नहीं
  • strong और em से शुरू करें; जरूरत पर mark, small, del, ins, sub और sup जोड़ें
  • जब महत्व, ज़ोर, संपादन या स्क्रिप्ट मायने रखें तो अर्थपूर्ण टैग प्राथमिकता दें
  • जब बिना अतिरिक्त अर्थ के सिर्फ दिखावट चाहिए तो CSS इस्तेमाल करें
  • नेस्टिंग सरल रखें और खोली हर टैग हमेशा बंद करें
  • टैग वाक्य के अर्थ से चुनें, हर चीज़ मोटा करने की आदत से नहीं

🧠 अपने ज्ञान की परीक्षा करें

शुरू करने के लिए तैयार

अपने ज्ञान की परीक्षा करें

इस इंटरैक्टिव क्विज़ के साथ अपनी चुनौती लें और देखें कि आप विषय को कितनी अच्छी तरह समझते हैं

❓
7
प्रश्न
🎯
70%
पास करने के लिए
♾️
∞
समय
🔄
∞
प्रयास

📝 निर्देश

  • हर प्रश्न को ध्यान से पढ़ें
  • हर प्रश्न के लिए सबसे अच्छा उत्तर चुनें
  • आप जितनी बार चाहें क्विज़ दोबारा दे सकते हैं
  • आपकी प्रगति शीर्ष पर दिखाई जाएगी