HTML Elements In Hindi

HTML Elements.

Common elements like headings (<h1> to <h6>), paragraphs (<p>), and line breaks (<br>)

जब आप किसी पर्टिकुलर एचटीएमएल बेस्ड वेबपेज को डेवेलोप करते है. तब आपको किसी वेब पेज वेबसाइट पर वेब कंटेंट सामग्री की संरचना और वेब रिसोर्स फोर्मत्टिंग्स के लिए सामान्य एचटीएमएल टैग्स/एलिमेंट्स जैसे हेडिंग्स, पैराग्राफ और लाइन ब्रेक, जैसे कुछ पॉपुलर एचटीएमएल टैग्स की जरूरत पड़ती हैं।

Here is a brief description of some popular html tags.

Html Heading Tags (<h1> to <h6>).

एचटीएमएल हैडिंग टैग का उपयोग आपके वेब पेज सामग्री की पदानुक्रमित स्ट्रक्चर आर्डर में सबसे बड़ी हैडिंग <h1> से लेकर सबसे छोटी हैडिंग <h6> साइज में डाटा और इनफार्मेशन को परिभाषित करने के लिए किया जाता है। सामान्य एचटीएमएल हैडिंग इन्फो <h1> (उच्चतम स्तर) से <h6> (निम्नतम स्तर) तक टेक्स्ट इन्फो डिस्प्ले होते हैं। जहा आमतौर पर, <h1> हैडिंग 1 का उपयोग किसी वेब पेज के मुख्य पृष्ठ हैडिंग लिखने के लिए किया जाता है. इसके बाद क्रमानुसार <h2> हैडिंग 2 का उपयोग उप-अनुभागों के लिए, <h3> हैडिंग 3 का उपयोग उप-अनुभागों के लिए किया जाता है. गूगल और सर्च इंजन में जब ये वेब पेज रैंक होते है, और सर्च इंजन इन वेब पेज सामग्री के संगठन और महत्व को समझने के लिए इन हेडिंग्स का उपयोग करते हैं।

Example.

<h1>Main Headings</h1>

<h2>Subsection 2 </h2>

<h3>Sub-section 3 </h3>

<h4>Sub-section 4 </h4>

<h5>Sub-section 5 </h5>

<h6>Sub-section 6 </h6>

Html heading tag example.

<html>

<body>

<title>Heading tag example</title>

<h1>Html Headings 1</h1>

<h2>Html Heading 2</h2>

<h3>Html Heading 3</h3>

<h4>Html Heading 4</h4>

<h5>Html Heading 5</h5>

<h6>Html Heading 6</h6>

</body>

</html>

Html Paragraph Tag (<p>).

एचटीएमएल <p> टैग एलिमेंट का उपयोग आपके वेब पेज पर एक से अधिक नए टेक्स्ट पैराग्राफ इनफार्मेशन को ऐड या मल्टीप्ल टेक्स्ट के पैराग्राफ को परिभाषित करने के लिए किया जाता है। यह आपके द्वारा हर एक से अधिक नए टेक्स्ट के ब्लॉकों के बीच स्पेस को जोड़ता है. जिससे किसी भी वेब पेज में एक से अधिक पैराग्राफ ब्लॉक या सेक्शन को बनाना और इन पैराग्राफ टेक्स्ट सामग्री को पढ़ना और समझना आसान हो जाता है।

Example

<p>You can add here one or more paragraph content! </p>

Simple paragraph tag html page example.

<html>

<body>

<h1>Html Paragraph tag example</h1>

<p>This is the simple paragraph demonstration </p>

<p>Html is a popular web development or web structuring markup language. Which helps to develop the basic structure of any website web page </p>

<p>Css helps us to design or decorate any ordinary look website or web page </p>

</body>

</html>

Line break (<br>).

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

Example.

<p>Html is great language <br> it is the core foundation of web development. </p>

Html br tag line break example.

<html>

<body>

<h1>Html Br Tag Example</h1>

<p>Html<br>Css<br>W3.css<br>Javascript<br>Bootstrap<br>Asp.net</p>

</body>

</html>

Lists (unordered <ul> and ordered <ol>) and list items (<li>)

किसी भी एचटीएमएल वेब पेज में लिस्ट्स का उपयोग वेब पेज टेक्स्ट जानकारी को स्ट्रक्चर्ड ऑर्डर्ड से व्यवस्थित और प्रस्तुत करने के लिए किया जाता है। सामान्यता एचटीएमएल मार्कअप लैंग्वेजे में लिस्ट्स दो मुख्य प्रकार की होती हैं. जिन्हे अनऑर्डर्ड लिस्ट (<ul>) और ऑर्डर्ड लिस्ट (<ol>), दोनों लिस्ट्स में लिस्ट वेब पेज आइटम या टेक्स्ट इन्फो को (<li>) टैग के साथ डिस्प्ले करते हैं।

तो चलिए अब हम डिटेल में एचटीएमएल ऑर्डर्ड और अनऑर्डर्ड लिस्ट के बारे में विस्तार से जाने।

Html Unordered list (<ul>).

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

<ul>

<li>Javascript</li>

</ul>

ऊपर दिया गया यह कोड पांच लिस्ट आइटमों के साथ एक अनऑर्डर्ड लिस्ट केटेगरी को बनाता है। डिफ़ॉल्ट रूप से, ब्राउज़र आमतौर पर प्रत्येक लिस्ट आइटम के लिए मार्कर के रूप में बुलेट पॉइंट को निर्धारित करते हैं. लेकिन आप सीएसएस के साथ एडवांस्ड अनऑर्डर्ड लिस्ट मार्कर स्टाइल को अपने अनुसार अनुकूलित कर सकते हैं।

Html Ordered list (<ol>).

किसी भी डिज़ाइन एचटीएमएल वेब पेज में एक ऑर्डर लिस्ट का उपयोग उन टेक्स्ट ऑब्जेक्ट की लिस्ट बनाने के लिए किया जाता है. जहां डिस्प्ले होने वाली टेक्स्ट इन्फो या ऑब्जेक्ट का क्रम सीक्वेंस आर्डर असेंडिंग आर्डर में महत्वपूर्ण होता है, और प्रत्येक डिस्प्ले लिस्ट आइटम को आम तौर पर आरोही क्रमिक रूप से क्रमांकित किया जाता है।

<ol>

<li>Python</li>

<li>C Programming</li>

<li>C++ Programming</li>

<li>Kotlin Programming</li>

</ol>

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

Html List item (<li>).

एचटीएमएल <li> टैग एलिमेंट का उपयोग किसी ऑर्डर्ड या अनऑर्डर्ड लिस्ट में अलग-अलग लिस्ट आइटम को परिभाषित करने के लिए किया जाता है। जहा प्रत्येक <li> टैग एलिमेंट लिस्ट में एक आइटम का प्रतिनिधित्व करता है।

<ul>

<li>Transgender</li>

</ul>

यहाँ दिए गए उदाहरण में, प्रत्येक <li> तत्व एक अनऑर्डर्ड लिस्ट लिस्ट में एक अलग लिस्ट आइटम का प्रतिनिधित्व करता है।

This is a perfect example of all list item display in single html web page.

<!DOCTYPE html>

<html>

<head>

<title>Html Ordered and Unordered List Example</title>

</head>

<body>

<h2>Html Unordered List Item Preview. </h2>

<ul>

<li>JavaScript</li>

</ul>

<h2>Html Ordered List Item Preview. </h2>

<ol>

<li>Python</li>

<li>C Programming</li>

<li>C++ Programming</li>

<li>Kotlin Programming</li>

</ol>

<h2>Html Li Tag Preview</h2>

<li>Transgender</li>

</body>

</html>

Special characters and entities

किसी भी कस्टम डिज़ाइन एचटीएमएल वेब पेज में, स्पेशल करैक्टर, जैसे एचटीएमएल में विशेष अर्थ वाले करैक्टर या ऐसे करैक्टर जो स्टैण्डर्ड करैक्टर सेट लाइब्रेरी का हिस्सा नहीं हैं. और इन्हे एचटीएमएल वेब पेज में अक्सर किसी कंपनी संस्थाओं का उपयोग करके दर्शाए जाते हैं। इन एचटीएमएल एन्टीटीएस करैक्टर सेट या स्पेशल शेप और सिंबल के अनुक्रम हैं. जो एम्परसेंड (&) सिंबल के साथ एचटीएमएल वेब पेज में शुरू किये जाते हैं, और सेमीकोलन (;) ऑपरेटर के साथ समाप्त होते हैं। इन स्पेशल एचटीएमएल सिंबल का उपयोग कई प्रकार के करैक्टर सेट या सिंबल को किसी भी वेब पेज में प्रदर्शित करने के लिए किया जाता है.

Here are some common special html character sets and their related HTML information.

< – less than sign or symbol.

HTML symbol format – &ltd.

Usage – मौजूदा एचटीएमएल पेज में < लेस्स दैन सिंबल का प्रतिनिधित्व करने के लिए उपयोग कर सकते है।

> – greater than sine.

HTML symbol format – &gt.

Usage – किसी भी वेब पेज में ग्रेटर दैन सिंबल > को दर्शाने के लिए उपयोग कर सकते है।

And – ampersand.

HTML symbol format – &amp.

Usage – एम्परसेंड और स्वयं का और अन्य एचटीएमएल सिंबल का प्रतिनिधित्व करने के लिए उपयोग कर सकते है।

“- double quotation marks.

HTML symbol format – &quot.

Usage – मौजूदा वेब पेज में डबल कोट्स सिंबल का प्रतिनिधित्व करने के लिए उपयोग कर सकते है।

‘ – single quotation mark (apostrophe).

HTML symbol format – &apos.

Usage – मौजूदा वेब पेज में सिंगल कोट्स इन्फोर्मशन और टेक्स्ट को दर्शाने के लिए उपयोग किया जाता है। ध्यान दें कि यह एचटीएमएल 4 के पुराने वर्शन में समर्थित नहीं है, लेकिन यह एचटीएमएल 5 और XML के साथ कार्य करता है।

HTML symbol format – &copy.

® – Registered trademark symbol.

HTML symbol format – &reg.

Usage – मौजूदा एचटीएमएल वेब पेज में पंजीकृत ट्रेडमार्क सिंबल ® का प्रतिनिधित्व करने के लिए उपयोग कर सकते है।

– non-breaking space.

HTML symbol format – &nbsp.

Usage – किसी भी एचटीएमएल वेब पेज में एक नॉन-ब्रेकिंग स्पेस डालने के लिए उपयोग किया जाता है. जो वेब ब्राउज़र को उस बिंदु पर टेक्स्ट को तोड़ने से रोकता है।

° – degree symbol.

HTML symbol format – &deg.

Usage – डिज़ाइन वेब पेज में डिग्री सिंबल ° का प्रतिनिधित्व करने के लिए उपयोग कर सकते है।

€ – Euro symbol.

HTML symbol format – &euro.

Usage – आप अपने वेब पेज में यूरो करेंसी सिंबल € का प्रतिनिधित्व करने के लिए उपयोग कर सकते है।

You can see a example of all above uses html special character set.

<!DOCTYPE html>

<html>

<head>

<title>Let’s Explore Some Special Characters in Html Web page</title>

</head>