.png)
Introduction to HTML Attributes
जितने भी HTML tags होते है उन सबमें attributes define किये जाते है। Attributes के द्वारा आप tags के अंदर के content को अपने अनुसार configure कर सकते है।
Attributes advanced configuration के लिए यूज़ किये जाते है। Attributes के द्वारा interpreter को additional commands दी जाती है जो उसे बताती है की किसी element के content को किस प्रकार show करना है।
उदाहरण के लिए आप default page background नहीं चाहते तो उसको अपने according change कर सकते है। ऐसे ही यदि आप default text color नहीं चाहते है तो उसे भी अपने अनुसार change कर सकते है।
- HTML attributes विशेष शब्द हैं जो तत्वों या विशेषताओं के बारे में अतिरिक्त जानकारी प्रदान करते हैं जो HTML तत्व के modifier हैं।
- प्रत्येक तत्व या टैग में attributes हो सकते हैं, जो उस तत्व के व्यवहार को परिभाषित करते हैं।
- Attributes को हमेशा start टैग के साथ लागू किया जाना चाहिए।
- Attribute हमेशा अपने name और value pair के साथ लागू किया जाना चाहिए।
- Attributes के नाम और value case sensitive हैं, और W3C द्वारा यह recommend किया जाता है कि इसे केवल lowercase में लिखा जाए।
- आप एक HTML तत्व में कई attributes जोड़ सकते हैं, लेकिन दो attributes के बीच space देने की आवश्यकता है।
Syntax HTML Attributes
HTML में attributes define करने का general syntax नीचे दिया जा रहा है।
<tagName attrName=”value”>
some content here.
</tagName>
जैसा की आप ऊपर दिए गए syntax में देख सकते है attributes को हमेशा starting tag में define किया जाता है। ये name और value के pair में लिखे जाते है।
Example of HTML Attributes
- <!DOCTYPE html>
- <html>
- <head>
- </head>
- <body>
- <h1> This is Style attribute</h1>
- <p style=“height: 50px; color: blue”>It will add style property in element</p>
- <p style=“color: red”>It will change the color of content</p>
- </body>
- </html>
आउटपुट:
उपरोक्त उदाहरण की व्याख्या:
- <p style=“height: 50px; color: blue”>It will add style property in element</p>
उपरोक्त कथन में, हमने paragraph tag का उपयोग किया है जिसमें हमने style attribute लागू की है। इस attribute का उपयोग किसी भी HTML तत्व पर CSS property को लागू करने के लिए किया जाता है। यह paragraph element को 50px की ऊंचाई प्रदान करता है और इसे नीले रंग में बदल देता है।
- <p style=“color: red”>It will change the color of content</p>
उपरोक्त कथन में हमने पैराग्राफ टैग में फिर से style attribute का उपयोग किया है, जो इसके रंग को लाल कर देता है।
The Title attribute in HTML in hindi
Description: title attribute का उपयोग अधिकांश ब्राउज़र में text tooltip के रूप में किया जाता है। जब उपयोगकर्ता किसी लिंक या किसी text पर कर्सर ले जाता है तो यह अपना text प्रदर्शित करता है। आप उस लिंक या text के बारे में description दिखाने के लिए किसी भी text या लिंक के साथ इसका उपयोग कर सकते हैं। हमारे उदाहरण में, हम पैराग्राफ टैग और हेडिंग टैग के साथ इसे ले रहे हैं।
Example
With <h1> tag:
<h1 title=“This is heading tag”>Example of title attribute</h1>
With <p> tag:
<p title=“This is paragraph tag”>Move the cursor over the heading and paragraph, and you will see a description as a tooltip</p>
Code:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1 title=“This is heading tag”>Example of title attribute</h1>
<p title=“This is paragraph tag”>Move the cursor over the heading and paragraph, and you will see a description as a tooltip</p>
</body>
</html>
Output:
<h1 title=“This is heading tag”>Example of title attribute</h1>
<p title=“This is paragraph tag”>Move the cursor over the heading and paragraph, and you will see a description as a tooltip</p>
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1 title=“This is heading tag”>Example of title attribute</h1>
<p title=“This is paragraph tag”>Move the cursor over the heading and paragraph, and you will see a description as a tooltip</p>
</body>
</html>
The href attribute in HTML in hindi
Description: href attribute <a> anchor टैग की मुख्य attribute है। यह attribute लिंक का पता देती है जो उस लिंक में निर्दिष्ट है। hyper attribute हाइपरलिंक प्रदान करती है, और यदि यह blank है, तो यह उसी पृष्ठ पर रहेगा।
Example
With link address:
<a href=“https://myhindiexam.tech/”>This is a link</a>
Without link address:
<a href=“”>This is a link</a>
The Src Attribute in hindi
Src attribute, <img> element के सबसे महत्वपूर्ण और आवश्यक attributes में से एक है यह उस imgage के लिए source है जिसे ब्राउज़र पर प्रदर्शित करना आवश्यक है। इस attribute में उसी directory या किसी अन्य directory में छवि हो सकती है। छवि का नाम या source सही होना चाहिए नहीं तो ब्राउज़र image को प्रदर्शित नहीं करेगा।
Example
<img src=“whitepeacock.jpg” height=“400” width=“600”>
<img src=“whitepeacock.jpg” height=“400” width=“600”>
Output:
Quotes: single quotes or double quotes?
इस अध्याय में आपने देखा है कि, हमने double quotes के साथ attribute का उपयोग किया है, लेकिन कुछ लोग HTML में single quotes का उपयोग कर सकते हैं। इसलिए HTML attribute के साथ single quotes का उपयोग करने की भी अनुमति है। निम्नलिखित दोनों कथन बिल्कुल ठीक हैं।
<a href=“https://hinditutorialspoint.com/”>A link to HTML.</a>
<a href=‘https://hinditutorialspoint.com/’>A link to HTML.</a>
HTML5 में, आप attribute value के आसपास quotes का उपयोग भी छोड़ सकते हैं।
<a href=https://myhindiexam.tech/>A link to HTML.</a>
.png)