अध्याय 3: HTML टैग्स और एलिमेंट्स

अध्याय 3: HTML टैग्स और एलिमेंट्स

HTML टैग्स का परिचय

HTML (हाइपरटेक्स्ट मार्कअप लैंग्वेज) वेब पेज बनाने के लिए उपयोग की जाने वाली एक मानक भाषा है। इसमें टैग्स का उपयोग करके वेब पेज के विभिन्न हिस्सों को परिभाषित किया जाता है। HTML टैग्स वे संकेत हैं जो ब्राउज़र को बताते हैं कि वेब पेज पर किस तरह की सामग्री प्रदर्शित करनी है और उसे कैसे प्रदर्शित करना है।

HTML टैग्स आमतौर पर कोणीय ब्रैकेट्स (<>) के अंदर लिखे जाते हैं, और ज्यादातर टैग्स एक प्रारंभ टैग और एक समाप्ति टैग के साथ आते हैं। प्रारंभ टैग और समाप्ति टैग के बीच की सामग्री HTML एलिमेंट कहलाती है।

उदाहरण:

<p>यह एक पैराग्राफ है।</p>

ऊपर दिए गए उदाहरण में <p> प्रारंभ टैग है, और </p> समाप्ति टैग है। इनके बीच का टेक्स्ट एक पैराग्राफ एलिमेंट है।

HTML एलिमेंट्स क्या हैं?

HTML एलिमेंट्स HTML डॉक्यूमेंट के बिल्डिंग ब्लॉक्स हैं। प्रत्येक एलिमेंट में एक प्रारंभ टैग, सामग्री, और एक समाप्ति टैग होता है। कुछ एलिमेंट्स में केवल प्रारंभ टैग ही होता है, जिन्हें खाली एलिमेंट्स कहा जाता है।

उदाहरण:

<h1>यह एक शीर्षक है</h1>
<p>यह एक पैराग्राफ है।</p>
<img src="image.jpg" alt="एक तस्वीर">

ऊपर दिए गए उदाहरण में:

  • <h1>यह एक शीर्षक है</h1> एक शीर्षक एलिमेंट है।
  • <p>यह एक पैराग्राफ है।</p> एक पैराग्राफ एलिमेंट है।
  • <img src="image.jpg" alt="एक तस्वीर"> एक खाली इमेज एलिमेंट है, जिसमें केवल प्रारंभ टैग है।

HTML एट्रिब्यूट्स

HTML एट्रिब्यूट्स टैग्स के अंदर अतिरिक्त जानकारी प्रदान करने के लिए उपयोग किए जाते हैं। ये प्रारंभ टैग में जोड़े जाते हैं और नाम-मान जोड़े (name-value pairs) के रूप में होते हैं।

उदाहरण:

<a href="https://www.example.com">यह एक लिंक है</a>
<img src="image.jpg" alt="एक तस्वीर" width="500" height="600">

ऊपर दिए गए उदाहरण में:

  • <a href="https://www.example.com">यह एक लिंक है</a> में href एट्रिब्यूट है, जो लिंक का URL निर्दिष्ट करता है।
  • <img src="image.jpg" alt="एक तस्वीर" width="500" height="600"> में src, alt, width, और height एट्रिब्यूट्स हैं, जो क्रमशः इमेज का स्रोत, वैकल्पिक टेक्स्ट, चौड़ाई और ऊंचाई निर्दिष्ट करते हैं।

Common HTML Attributes

HTML में कई सामान्य एट्रिब्यूट्स होते हैं जिनका उपयोग विभिन्न टैग्स के साथ किया जा सकता है:

  1. style:किसी एलिमेंट के CSS स्टाइल्स को इनलाइन जोड़ने के लिए उपयोग किया जाता है।
    <p style="color:blue; font-size:14px;">यह एक पैराग्राफ है।</p>
  2. href:
    लिंक के URL को निर्दिष्ट करता है।
    <a href="https://www.example.com">यह एक लिंक है</a>
  3. src:इमेज, वीडियो, या अन्य मीडिया फाइलों के स्रोत को निर्दिष्ट करता है।
    <img src="image.jpg" alt="एक तस्वीर">
  4. alt:इमेज का वैकल्पिक टेक्स्ट प्रदान करता है, जो इमेज लोड न होने पर या स्क्रीन रीडर्स के लिए उपयोगी होता है।
    <img src=”image.jpg” alt=”एक तस्वीर”>
  5. width और height:इमेज या वीडियो के आकार को निर्दिष्ट करते हैं।
    <img src="image.jpg" alt="एक तस्वीर" width="500" height="600">
  6. lang:डॉक्यूमेंट या एलिमेंट की भाषा को निर्दिष्ट करता है।
    <html lang="hi">
    <p lang="en">This is a paragraph in English.</p>
  7. title:एलिमेंट पर माउस ले जाने पर प्रदर्शित होने वाला अतिरिक्त सूचना या विवरण प्रदान करता है।
    <abbr title="Hypertext Markup Language">HTML</abbr>

ये सामान्य एट्रिब्यूट्स HTML एलिमेंट्स को अधिक इंटरैक्टिव और उपयोगकर्ता के अनुकूल बनाने में मदद करते हैं। इनका सही उपयोग करने से वेब पेज की एक्सेसिबिलिटी और कार्यक्षमता में सुधार होता है।

संक्षेप में

HTML टैग्स, एलिमेंट्स और एट्रिब्यूट्स का उपयोग करके आप वेब पेज के विभिन्न हिस्सों को परिभाषित और नियंत्रित कर सकते हैं। इस अध्याय में हमने HTML टैग्स का परिचय, HTML एलिमेंट्स क्या हैं, और HTML एट्रिब्यूट्स के बारे में सीखा। अगले अध्याय में हम HTML के कुछ सामान्य टैग्स और उनके उपयोगों के बारे में विस्तार से जानेंगे।



Index