पाठ तत्व

docs.scrimba.com

एक पृष्ठ पर जो कुछ भी आगंतुक पढ़ते हैं वह अधिकांशतः सादा लिखित सामग्री है: शीर्षक, पैराग्राफ, एक साहसिक चेतावनी, एक उद्धृत पंक्ति, कोड का एक स्निपेट। HTML के पास इनमें से प्रत्येक कार्य के लिए एक विशिष्ट तत्व है, और सही एक चुनना न केवल यह बदलता है कि पाठ कैसा दिखता है। यह ब्राउज़र, सर्च इंजन, और सहायक उपकरणों को बताता है कि पाठ का प्रत्येक भाग वास्तव में क्या है।

शीर्षक और पदानुक्रम

HTML आपको शीर्षक के छह आकार देता है, <h1> से नीचे <h6> तक। एक शीर्षक पृष्ठ के लिए या इसके एक भाग के लिए एक शीर्षक है। <h1> मुख्य शीर्षक है, शीर्ष पर बड़ा वाला। <h2> एक प्रमुख खंड को लेबल करता है, <h3> उसके अंदर एक उप-खंड को, और इसी तरह नीचे <h6> तक।

एक मुद्रित पुस्तक के बारे में सोचें। कवर पर शीर्षक <h1> है। प्रत्येक अध्याय का शीर्षक एक <h2> है। अध्याय के अंदर के शीर्षक <h3> हैं। आप यह दिखाने के लिए स्तरों का उपयोग करते हैं कि क्या किसके अधीन है।

शुरुआत से ही एक बात को पकड़ना: एक शीर्षक को इसलिए न चुनें क्योंकि यह पाठ को आप चाहते हैं आकार देता है। <h1> बड़ा दिखता है, लेकिन इसका काम "यह मुख्य शीर्षक है" कहना है, "यह बड़ा करो" नहीं। यदि आप कहीं बड़ा पाठ चाहते हैं, तो वह CSS के लिए एक काम है।

छह शीर्षक तत्व, <h1> के माध्यम से <h6>, एक दस्तावेज़ के पदानुक्रम का वर्णन करते हैं: कौन से भाग खंड हैं और कौन से उप-खंड हैं। संख्या आकार नहीं, रैंक है। <h1> रूपरेखा के शीर्ष पर है, <h2> इसके अधीन बैठता है, <h3> उसके अधीन।

जल्दी बनाने के लिए नियम उन्हें क्रम में घोंसला करना और एक स्तर छोड़ना नहीं है। एक <h2> शीर्षक वाला खंड <h3> उप-खंड में होना चाहिए, सीधे <h4> पर न जाएं। एक छोटे डिफ़ॉल्ट आकार तक पहुंचने के लिए स्तरों को छोड़ना क्लासिक गलती है, और यह गलत उपकरण है: यदि आप चाहते हैं कि एक शीर्षक एक निश्चित तरीके से दिखे, तो इसे CSS के साथ स्टाइल करें, और संख्या को इसकी संरचना में रैंक के लिए आरक्षित रखें।

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

पहला, प्रति पृष्ठ एक <h1> का उपयोग करें, उस पृष्ठ की सामग्री का सच्चा शीर्षक। यह रूपरेखा के शीर्ष पर है, और बिल्कुल एक होने से हर उपकरण को पृष्ठ के बारे में एक एकल स्पष्ट लंगर देता है।

दूसरा, नीचे जाते समय स्तर न छोड़ें। एक स्क्रीन रीडर (सॉफ़्टवेयर जो पृष्ठ को जोर से पढ़ता है उन लोगों के लिए जो इसे नहीं देख सकते) अपने उपयोगकर्ता को हर शीर्षक की एक सूची खींचने और उनके बीच कूदने देता है, जिस तरह एक दृश्य पाठक अपने द्वारा चाहे जाने वाले खंड के लिए छोड़ता है। <h2> से <h4> तक की एक कूद उस सूची में एक लापता स्तर के रूप में पढ़ी जाती है, और नेविगेशन समझ में आना बंद कर देता है।

तीसरा, रैंक अर्थ हैं, कभी आकार नहीं। सर्च इंजन यह समझने के लिए शीर्षक संरचना पढ़ते हैं कि एक पृष्ठ कैसे आयोजित किया जाता है, इसलिए एक <h3> चुना गया क्योंकि इसका डिफ़ॉल्ट आकार सही दिखता था, वास्तव में यह एक तीसरे स्तर का खंड है, चुपचाप क्रॉलर और स्क्रीन रीडर दोनों को गलत जानकारी देता है। CSS में आकार निर्धारित करें; संख्या को अर्थ ले जाने दें।

<h1>शुरुआत के लिए साइर्डाउ</h1>

<h2>एक स्टार्टर बनाना</h2>
<p>एक स्टार्टर मैदा और पानी की एक जीवंत संस्कृति है।</p>

<h3>दिन एक से तीन</h3>
<p>मैदा और पानी के बराबर वजन मिलाएं, फिर प्रतीक्षा करें।</p>

<h2>अपकी पहली लोफ बेकिंग करना</h2>
<p>एक बार स्टार्टर सक्रिय हो जाने पर, आप बेक करने के लिए तैयार हैं।</p>

एक <h1> पूरे पृष्ठ को नाम देता है। दो <h2> शीर्षक प्रमुख अनुभागों को चिन्हित करते हैं, और <h3> उनमें से पहले के अंदर सुंदर बैठता है। शीर्षक संख्याओं को अपने आप पढ़ें और आप बिना शरीर के एक शब्द पढ़े लेख का आकार देख सकते हैं।

Junoशीर्षक और पदानुक्रम छह शीर्षक, <h1> नीचे <h6> तक, और <h1> शीर्ष पर एक मुख्य शीर्षक है। बाकी आपके अनुभागों और उप-अनुभागों को लेबल करते हैं। जाल जो मुझे जल्दी मिल गया: एक शीर्षक को मत पकड़ो सिर्फ इसलिए कि यह बड़ा दिखता है, वह CSS के लिए क्या है। संख्या इस बारे में है कि चीज क्या है, न कि इसका आकार।

Junoशीर्षक और पदानुक्रम शीर्षक आपकी सामग्री को रैंक करते हैं, वे इसका आकार नहीं देते। उन्हें क्रम में घोंसला करें और एक छोटे डिफ़ॉल्ट पर उतरने के लिए एक स्तर न छोड़ें, वह है जो लोगों को त्रिप्स करता है। एक शीर्षक को एक निश्चित तरीके से दिखना चाहिए? इसे CSS में स्टाइल करें और संख्या को संरचना का वर्णन करने दें।

Junoशीर्षक और पदानुक्रम प्रति पृष्ठ एक <h1>, नीचे जाते समय कोई छोड़ा गया स्तर नहीं, और कभी भी रैंक को इसके आकार के लिए न चुनें। स्क्रीन रीडर उपयोगकर्ता शीर्षकों के बीच एक विषय सूची की तरह कूदते हैं, और सर्च इंजन समान रूपरेखा पढ़ते हैं, इसलिए दिखता है के लिए चुना गया एक शीर्षक दोनों को गलत जानकारी देता है। संख्या को अर्थपूर्ण रखें और उपस्थिति को CSS में धकेलें।

पैराग्राफ और लाइन ब्रेक

सामान्य पाठ का एक ब्लॉक एक पैराग्राफ में जाता है, <p> तत्व। प्रत्येक पैराग्राफ को अपने <p>...</p> में लपेटें और ब्राउज़र इसे ऊपर और नीचे थोड़ी जगह देता है, इसलिए पैराग्राफ एक किताब की तरह अलग बैठते हैं।

<p>ब्रेड को चार चीजें चाहिए: मैदा, पानी, नमक, और समय।</p>
<p>यदि आप यह सही करते हैं तो बाकी धैर्य है।</p>

ध्यान दें कि आपकी HTML फ़ाइल में Enter दबाने से पृष्ठ पर कुछ नहीं होता। ब्राउज़र आपके द्वारा टाइप किए गए लाइन ब्रेक और अतिरिक्त स्थान को अनदेखा करता है; यह केवल टैग की परवाह करता है। यही कारण है कि आपको पैराग्राफों को अलग करने के लिए <p> की आवश्यकता है, बजाय उन्हें विभिन्न पंक्तियों पर टाइप करने के।

यदि आप वास्तव में एक पैराग्राफ के अंदर एक लाइन को तोड़ने की आवश्यकता है, जैसे किसी पते की पंक्तियां या एक छोटी कविता, तो इसके लिए एक <br> तत्व है। यह एक एकल लाइन ब्रेक को मजबूर करता है और कुछ नहीं।

<p> तत्व बहती हुई पाठ का एक पैराग्राफ रखता है, और यह शरीर सामग्री के लिए डिफ़ॉल्ट घर है। ब्राउज़र आपके स्रोत में स्थान, टैब और न्यूलाइन की किसी भी रन को एकल स्थान में विघटित करता है, इसलिए पृष्ठ पर आपके पाठ का लेआउट टैग से आता है, न कि आपके द्वारा फ़ाइल को कैसे प्रारूपित किया जाता है।

<br> तत्व पाठ के एक ब्लॉक के भीतर एक लाइन ब्रेक को मजबूर करता है। यह एक शून्य तत्व है, कोई समापन टैग नहीं, और यह तभी सही है जब ब्रेक सामग्री का हिस्सा हो: डाक पते, एक कविता की पंक्तियां, एक हस्ताक्षर ब्लॉक।

<p>
  राज वर्मा<br>
  14 बाग लेन<br>
  दिल्ली DL 4TR
</p>

जहां <br> गलत है वह एक अंतराल उपकरण के रूप में है। <br><br> को ढेर करना दो पैराग्राफों को अलग करने के लिए ठीक दिखता है और गलत सहज ज्ञान है: ये दो पैराग्राफ हैं, इसलिए वे दो <p> तत्व हैं, और उनके बीच का अंतर प्रस्तुति है, जो CSS से संबंधित है। अंतराल बनाने के लिए <br> तक पहुंचना संरचना और शैली को मिलाता है, ठीक आदत जो शुरुआत में तोड़ने लायक है।

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

<br> एक लाइन ब्रेक का प्रतिनिधित्व करता है जो सामग्री के लिए अर्थपूर्ण है, लेआउट अंतराल नहीं। अंतर का एक ठोस पहुंचनीयता लागत है। एक स्क्रीन रीडर एक <p> सीमा को एक पैराग्राफ के अंत के रूप में मानता है और तदनुसार रुकता है, इसके उपयोगकर्ता को यह समझ देता है कि एक विचार कहां समाप्त होता है और अगला शुरू होता है। <br> तत्वों का एक ढेर ऐसी कोई सीमा नहीं देता है: सॉफ़्टवेयर सीधे पढ़ता है, और दृश्य पाठक अंतराल में जो संरचना देखता है वह श्रोता के लिए अदृश्य है। खाली पैराग्राफ स्पेसर के रूप में उपयोग किए जाते हैं, कुछ स्क्रीन रीडर उन्हें रिक्त के रूप में घोषित करते हैं, अन्य उन्हें छोड़ते हैं, और किसी भी तरह से अंतराल जो आपने इच्छा की थी वह संचार नहीं होता है।

नियम जो वास्तविक परियोजनाओं के साथ संपर्क में जीवित रहता है: <br> केवल तब जब ब्रेक डेटा का हिस्सा हो (एक पता, पद्य, एक फॉर्म लेबल में एक पंक्ति), और ब्लॉकों के बीच लंबवत अंतराल हमेशा CSS में margin के साथ। संरचना अर्थ ले जाती है; शैली प्रकटन ले जाती है, और उन्हें अलग रखना यह है कि एक पृष्ठ को बनाए रखने योग्य और सुलभ दोनों बनाता है।

Junoपैराग्राफ और लाइन ब्रेक पाठ के प्रत्येक ब्लॉक को अपने <p>...</p> में जाता है, और वह है जो पैराग्राफों के बीच अंतराल डालता है। ब्राउज़र आप जो Enters और spaces टाइप करते हैं उन्हें अनदेखा करता है, इसलिए टैग काम करते हैं। <br> का उपयोग केवल तब करें जब एक लाइन को वास्तव में एक पैराग्राफ के बीच में तोड़ने की आवश्यकता हो, जैसे एक पता।

Junoपैराग्राफ और लाइन ब्रेक<p> एक पैराग्राफ के लिए, और ब्राउज़र आपके स्रोत व्हाइटस्पेस को विघटित करता है इसलिए फ़ाइल को प्रारूपित करना पृष्ठ पर कुछ नहीं बदलता। <br> उन ब्रेक के लिए है जो सामग्री से संबंधित हैं, जैसे एक पता, कभी चीजों को अलग करने के लिए नहीं। दो <br> एक अंतराल बनाने के लिए बताता है कि अंतराल CSS से बाहर निकल गया है।

Junoपैराग्राफ और लाइन ब्रेक<p> एक ब्लॉक है जो एक स्क्रीन रीडर को एक वास्तविक पैराग्राफ सीमा पर रोकता है; <br> की एक स्टैक इसे कुछ नहीं देता है और जो कोई सुन रहा है उसके लिए संरचना गायब हो जाती है। तो <br> केवल तब जब ब्रेक डेटा का हिस्सा हो, और सभी लंबवत अंतराल CSS में margin के साथ। खाली पैराग्राफ स्पेसर के रूप में समान पहुंचनीयता छेद होते हैं, उन्हें भी छोड़ें।

जोर: <strong> और <b>, <em> और <i>

दो तत्व पाठ को साहसिक बनाते हैं, और दो इसे इटैलिक बनाते हैं। <strong> और <b> दोनों साहसिक प्रस्तुत करते हैं; <em> और <i> दोनों इटैलिक प्रस्तुत करते हैं। तो चार टैग, दो दिखता है।

<p><strong>चेतावनी:</strong> ओवन बहुत गर्म है।</p>
<p>आपको आटे को <em>गहराई से</em> गूंधने की जरूरत है।</p>

अभी के लिए, <strong> तक पहुंचें जब कुछ पाठ महत्वपूर्ण हो, जैसे एक चेतावनी, और <em> जब आप किसी शब्द पर जोर देना चाहते हैं जिस तरह आपकी आवाज़ होगी यदि आप जोर से पढ़ रहे हों। वे दोनों हैं जो आप ज्यादातर समय चाहते हैं, और ब्राउज़र उन्हें साहसिक और इटैलिक बनाता है।

चार तत्व दो जोड़ी में विभाजित होते हैं, और विभाजन अर्थ और प्रकटन के बीच है। <strong> और <em> अर्थपूर्ण हैं: वे पाठ के बारे में कुछ कहते हैं। <b> और <i> प्रस्तुतिपरक हैं: वे केवल यह बदलते हैं कि यह कैसा दिखता है।

<strong> का उपयोग करें जब सामग्री महत्व, गंभीरता, या तात्कालिकता करती है: एक चेतावनी, एक महत्वपूर्ण निर्देश। तनाव जोर के लिए <em> का उपयोग करें, वह शब्द जिस पर आप यदि आप वाक्य को जोर से पढ़ते हैं तो झुकते, जो इसका अर्थ बदल सकता है। दोनों संयोग से साहसिक और इटैलिक क्रमशः प्रस्तुत करते हैं, लेकिन आप उन्हें उनके अर्थ के लिए चुन रहे हैं।

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

<p><strong>मत</strong> करो वाल्व खोलो जबकि सिस्टम दबाव में है।</p>
<p>वह फुसफुसाई कि यह <em>उसका</em> विचार था, उसका नहीं।</p>
<p>कीबोर्ड शॉर्टकट <b>Ctrl</b> प्लस <b>S</b> है।</p>
<p>हम फेरी में <i>लेडी मेरिओन</i> पर सवार हो गए।</p>

यदि आप केवल एक बात याद रखते हैं: <strong> और <em> इसका अर्थ है, <b> और <i> बस दिखाते हैं। जब पाठ वास्तव में मायने रखता है, तो अर्थपूर्ण जोड़ी तक पहुंचें।

सभी चार एक ब्राउज़र द्वारा डिफ़ॉल्ट रूप से समान दो तरीकों से प्रस्तुत करते हैं, साहसिक या इटैलिक, इसलिए स्क्रीन पर वे विनिमेय हैं। अंतर यह है कि वे उन सभी को संचार करते हैं जो पिक्सल में नहीं देख रहे हैं, और वह है जहां पसंद वास्तव में रहता है।

<strong> महत्व को चिन्हित करता है: सामग्री जो गंभीर है, तात्कालिक है, या मिस नहीं किया जाना चाहिए। <em> तनाव जोर को चिन्हित करता है: वह शब्द जिसका वजन वाक्य के अर्थ को बदलता है ("कल मुझे कॉल करें" बनाम "कल मुझे कॉल करें")। एक स्क्रीन रीडर इन पर कार्य कर सकता है। कई जोर पर टोन या गति को बदलेंगे, और एक <strong> साधारण गद्य से अलग सतह पर आ सकता है, इसलिए महत्व आपने एन्कोडेड किया है वास्तव में उस व्यक्ति को बताया जाता है जो साहसिक नहीं देख रहा है। उन्हें नीचे के लिए नीचे: <strong> के अंदर <strong> <em> के अंदर <em> के रूप में अधिक महत्व के रूप में भारी तनाव के रूप में पढ़ता है।

<b> और <i> प्रस्तुतिपरक जोड़ी हैं, और वे अक्सर "उन्हें से बचें" सलाह से अधिक बार सही विकल्प हैं। उनकी वास्तविक परिभाषाएं संकीर्ण हैं। <b> किसी व्यावहारिक कारण के लिए पाठ में ध्यान आकर्षित करता है बिना किसी अतिरिक्त महत्व के: एक सारांश में कीवर्ड, एक समीक्षा में एक उत्पाद का नाम। <i> एक वैकल्पिक आवाज या मूड में पाठ को चिन्हित करता है: पहले उपयोग पर एक तकनीकी शब्द, होमो सेपियन्स जैसे एक वर्गीकृत नाम, दूसरी भाषा में एक मुहावरे, एक पात्र का आंतरिक विचार। जब एक अधिक विशिष्ट तत्व होता है (<cite> एक काम के शीर्षक के लिए, <dfn> एक परिभाषा के लिए, <code> कोड के लिए), इसके बजाय इसका उपयोग करें; <b> और <i> फॉलबैक होते हैं जब पाठ अलग सेट होता है लेकिन कोई मजबूत अर्थ लागू नहीं होता है।

विफलता मोड से बचना <b> का उपयोग करना है जहां आप <strong> का मतलब रखते हैं, या <i> जहां आप <em> का मतलब रखते हैं। वे समान दिखते हैं, इसलिए स्क्रीन पर कुछ भी आपको बताता है कि यह गलत है, लेकिन आपने महत्व या जोर को फेंक दिया है कि सहायक तकनीक पर निर्भर करता है। पूछें कि पाठ का अर्थ क्या है, न कि यह कैसा दिखना चाहिए: यदि यह मायने रखता है, <strong> या <em>; यदि यह केवल अलग सेट है, <b> या <i>।

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

Junoजोर: strong और b, em और i<strong> मतलब महत्वपूर्ण, <em> मतलब जोर दिया गया, और दोनों अर्थ ले जाते हैं। <b> और <i> समान साहसिक और इटैलिक हैं उनके पीछे कोई अर्थ नहीं, पाठ के लिए जिसे आप बस अलग सेट करना चाहते हैं। एक ही दिखता है, इसलिए पाठ का अर्थ क्या है, न कि यह कैसा दिखना चाहिए, इसके अनुसार जोड़ी चुनें।

Junoजोर: strong और b, em और i स्क्रीन पर सभी चार सिर्फ साहसिक या इटैलिक हैं; अंतर यह है कि एक स्क्रीन रीडर क्या सुनता है। <strong> और <em> महत्व और तनाव को एन्कोड करते हैं और अलग से घोषित किए जा सकते हैं, इसलिए <b> या <i> को पकड़ना जब आप उन्हें चुपचाप अर्थ को गिराते हैं। <b> और <i> पाठ के लिए सही हैं जो केवल अलग सेट है, एक कीवर्ड या एक शब्द, जब कोई अधिक विशिष्ट तत्व फिट नहीं होता है।

अन्य इनलाइन पाठ (उद्धरण, <code>, <abbr>, और मित्र)

साहसिक और इटैलिक से परे, HTML के पास पाठ के सामान्य बिट्स के लिए छोटे तत्व हैं। एक छोटा उद्धरण <q> में बैठता है, और ब्राउज़र उद्धरण चिन्ह आपके लिए जोड़ता है। कोड का एक टुकड़ा, जैसे किसी कमांड का नाम, <code> में जाता है, जो ब्राउज़र एक मोनोस्पेस फॉन्ट में दिखाता है इसलिए यह सामान्य लेखन से अलग होता है।

<p>मेरी दादी हमेशा कहती थीं <q>एक देखा बर्तन कभी नहीं उबलता</q>।</p>
<p><code>Ctrl S</code> शॉर्टकट के साथ फ़ाइल सहेजें।</p>

इसके अलावा कुछ और हैं, लेकिन <q> एक छोटे उद्धरण के लिए और <code> कोड के लिए दो हैं जिन्हें आप सबसे अधिक मिलेंगे। प्रत्येक पाठ के एक छोटे टुकड़े को लपेटता है और ब्राउज़र को बताता है कि यह क्या है।

ये इनलाइन तत्व हैं: वे एक पैराग्राफ के अंदर पाठ की एक रन को लपेटते हैं बिना अपनी पंक्ति पर तोड़े, एक ब्लॉक जैसे <p> के विपरीत। प्रत्येक का नाम क्या एक टुकड़ा पाठ है, इसलिए सादे <span> को स्टाइल करने के बजाय विशिष्ट तत्व तक पहुंचें।

जिन्हें जानने योग्य हैं:

<p>रिपोर्ट <cite>व्यावहारिक प्रोग्रामर</cite> का उल्लेख करती है।</p>
<p><code>npm install</code> चलाएं, फिर <kbd>Enter</kbd> दबाएं।</p>
<p>कमरा <strong>24m<sup>2</sup></strong> फर्श स्थान है।</p>
<p>पुरानी कुल <del>₹2400</del> <ins>₹1900</ins> थी।</p>
<p>जैसा कि <abbr title="हाइपरटेक्स्ट मार्कअप लैंग्वेज">HTML</abbr> परिपक्व होता है, टैग निपट जाते हैं।</p>

<cite> एक काम का शीर्षक नाम देता है। <code> कोड को चिन्हित करता है, <kbd> कीबोर्ड इनपुट को चिन्हित करता है, और <samp> प्रोग्राम आउटपुट को चिन्हित करता है। <sup> और <sub> सुपरस्क्रिप्ट और सबस्क्रिप्ट हैं, घातांक और रासायनिक सूत्र जैसी चीजों के लिए। एक डिग्री चिन्ह इसका अपना वर्ण है, °, सुपरस्क्रिप्ट के बजाय। <del> और <ins> हटाए गए और सम्मिलित पाठ को चिन्हित करते हैं, एक संपादन या मूल्य परिवर्तन दिखाने के लिए उपयोगी। <abbr> एक संक्षिप्त नाम को चिन्हित करता है, और इसकी title विशेषता पूर्ण विस्तार रखती है।

<q> एक छोटे इनलाइन उद्धरण के लिए है और स्वचालित रूप से उद्धरण चिन्ह जोड़ता है। एक लंबे, स्वतंत्र उद्धरण के लिए आप <blockquote> चाहते हैं, जो एक ब्लॉक तत्व है।

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

सेट जिसे आप वास्तव में उपयोग करेंगे:

<p><cite>डेटा-सघन अनुप्रयोग डिजाइन</cite>, अध्याय तीन देखें।</p>
<p>देखने के लिए <kbd>git status</kbd> टाइप करें <samp>कोई प्रतिबद्धता नहीं</samp>।</p>
<p>नमूने ने <abbr title="कैस्केडिंग स्टाइल शीट">CSS</abbr> चर का उपयोग किया।</p>
<p>संशोधित आंकड़ा: <del>1,200</del> <ins>1,450</ins> प्रविष्टियां।</p>

<cite> एक उद्धृत कार्य का शीर्षक को चिन्हित करता है (एक किताब, फिल्म, या कागज), एक व्यक्ति का नाम नहीं, एक बिंदु जो लोग लगातार गलत समझते हैं। <code> कंप्यूटर कोड का एक टुकड़ा है और <kbd> उपयोगकर्ता कीबोर्ड इनपुट है, दो चीजें जो अक्सर मोनोस्पेस प्रस्तुत करते हैं लेकिन इंटरैक्शन के विपरीत दिशा का अर्थ। <samp> एक प्रोग्राम से नमूना आउटपुट है। <abbr> एक संक्षिप्त नाम को चिन्हित करता है और पूर्ण विस्तार रखते हुए एक title विशेषता लेता है; एक स्क्रीन रीडर उस विस्तार को घोषित या प्रस्तुत कर सकता है, और यह होवर पर एक टूलटिप के रूप में दिखाई देता है, इसलिए पाठक कभी भी यह अनुमान लगाने के लिए छोड़ा नहीं जाता है कि पत्र क्या हैं। <del> और <ins> एक संपादन का प्रतिनिधित्व करते हैं, पाठ हटाया गया और पाठ जोड़ा गया, और ऐसे घोषित किए जाते हैं, जो महत्वपूर्ण है जहां परिवर्तन बिंदु है, जैसे एक मूल्य सुधार या एक रेडलाइन।

उद्धरणों के लिए, <q> इनलाइन है और CSS के माध्यम से लोकेल-जागरूक उद्धरण चिन्ह डालता है (यही कारण है कि आप स्वयं चिन्ह टाइप नहीं करते), जबकि <blockquote> एक विस्तारित उद्धरण के लिए ब्लॉक-स्तरीय तत्व है, और दोनों एक वैकल्पिक cite विशेषता लेते हैं स्रोत का URL रखते हुए। इन सभी के पार का थ्रूलाइन: तत्व अर्थ है, और प्रकटन एक अलग परत है जिसे आप CSS में सेट करते हैं। टैग को इसलिए चुनना कि पाठ क्या है, न कि एक मोनोस्पेस या इटैलिक दिखता है, वह है जो पृष्ठ को उन उपकरणों के लिए पठनीय रखता है जो इसे नहीं देख सकते।

Junoअन्य इनलाइन पाठ (उद्धरण, कोड, संक्षिप्त नाम, और मित्र)<q> एक छोटे उद्धरण को लपेटता है और आपके लिए उद्धरण चिन्ह जोड़ता है, और <code> कोड को एक मोनोस्पेस फॉन्ट में दिखाता है इसलिए यह अलग होता है। कुछ और के ये छोटे टैग हैं, लेकिन वे दो सबसे अधिक आते हैं। प्रत्येक पाठ का एक छोट बिट को लपेटता है और कहता है कि यह क्या है।

Junoअन्य इनलाइन पाठ (उद्धरण, कोड, संक्षिप्त नाम, और मित्र) ये इनलाइन टैग प्रत्येक का नाम है कि एक टुकड़ा क्या है: <code> कोड के लिए, <kbd> दबाई गई कुंजियों के लिए, <cite> किसी काम के शीर्षक के लिए, <abbr> पूर्ण रूप के साथ title के साथ। सादे <span> को स्टाइल करने के बजाय विशिष्ट तक पहुंचें। और <q> एक छोटे उद्धरण के लिए, <blockquote> एक स्वतंत्र के लिए।

Junoअन्य इनलाइन पाठ (उद्धरण, कोड, संक्षिप्त नाम, और मित्र) सबसे विशिष्ट इनलाइन तत्व का उपयोग करें और केवल तभी <span> पर वापस जाएं जब कुछ भी फिट नहीं हो। उन्हें देखें जिन्हें लोग गलत उपयोग करते हैं: <cite> किसी काम का शीर्षक है, एक व्यक्ति नहीं, और <code> बनाम <kbd> समान दिखते हैं लेकिन इंटरैक्शन के विपरीत छोर का अर्थ है। <abbr>'s title सहायक तकनीक द्वारा पढ़ा जाता है, और <q> अपने स्वयं के उद्धरण चिन्ह की आपूर्ति करता है, इसलिए उन्हें टाइप न करें।