इस पोस्ट में आप जानेंगे कि What Is Attributes In Html? – एच टी एम एल में गुण क्या हैं?, इस पोस्ट में मैंने सभी Html Attribute के सभी Basic और Advance Concepts को बहुत ही आसान और सरल शब्दों में समझाने का प्रयास किया हैं।
“पढ़ाई के साथ हर प्रक्रिया का आनंद लें।”– Sanju Dhritlahre
Table Of Content
What Is Attributes?
Attribute In Tag
Definition Of Attributes ( ऐट्रिब्यूट्स की परिभाषा )
Basic Html Attributes
lang Attribute
lang Attribute in Country codes
href Attribute
src Attribute
Two Ways To Specify The src Attribute:
Absolute URL
Relative URL
width & hight Attribute
alt Attribute
Global Attribute
Always Use Lowercase Attributes
Always Quote Attribute Values
Single or Double Quotes? ( एकल और दोहरे उद्धरण )
Conclusion ( निष्कर्ष )
What Is Attributes In Html In Hindi? – एच टी एम एल में गुण क्या हैं?
सभी Html तत्वों (Elements) में Attributes हो सकते हैं।
Attributes तत्वों (Elements) के बारे में अतिरिक्त जानकारी प्रदान करते हैं।
Attributes हमेशा Opening Tag (Start Tag) से ही निर्दिष्ट (Specified) होती हैं।
Attributes आमतौर पर Name/Value जोड़े में आते हैं जैसे: name = “value”
Attributes In Tag
Tag में Attributes हो सकते हैं, जो जानकारी के अतिरिक्त Bits हैं। Attributes शुरुआती Tag के अंदर दिखाई देती हैं और उनके मान उद्धरण चिन्हों ( Quotation Mark ) के अंदर होते हैं। ये कुछ इस तरह दिखते हैं;
For Example :
<tag attributes="value">Sketchy Knowledges</tag>Definition Of Attributes ( ऐट्रिब्यूट्स की परिभाषा )
Attributes तत्वों (Elements) की अतिरिक्त जानकारी, विशेषताओं या गुणों को परिभाषित करती हैं। जैसे; किसी किसी छवि की चौड़ाई और ऊंचाई।
Attributes हमेशा प्रारंभ टैग (Start Tag) में निर्दिष्ट होते हैं और आमतौर पर Name/Value जोड़े आते हैं। जैसे; Name =”value” शामिल होते हैं।
For Example:
<abbr title="Hypertext Text Markup Language">HTML</abbr>उपरोक्त उदाहरण में <abbr> Tag के अंदर title एक विशेषता हैं।
Basic Html Attributes
lang Attribute
हमें वेब पेज की भाषा को घोषित करने के लिए हमेशा <html> Tag के अंदर lang Attribute को शामिल करना होता हैं।
यह खोज इंजन और ब्राउज़र की सहायता करने के लिए है आवश्यक होता हैं।
For Example :
<!DOCTYPE html>
<html lang="en">
<head>
<title> lang Attribute </title>
</head>
<body>
................
</body>
</html>निम्नलिखित यह उदाहरण अंग्रेजी को भाषा के रूप में निर्दिष्ट करता है।
lang Attribute in Country codes
lang Attribute में भाषा कोड में देश कोड भी जोड़े जा सकते हैं।
तो, पहले दो अक्षर HTML पृष्ठ की भाषा को परिभाषित करते हैं, और अंतिम दो वर्ण देश को परिभाषित करते हैं।
<!DOCTYPE html>
<html lang="en-ID">
<body>
...
</body></html>निम्नलिखित इस उदाहरण में अंग्रेजी को भाषा के रूप में और भारत को देश के रूप में निर्दिष्ट करता है।
href Attribute
यह एक Hyperlink हैं, इसके द्वारा Web-Pages को आपस में Link किया जाता हैं।
Anchor Tag (<a>) हाइपरलिंक को परिभाषित करता है।
href Attribute उस पृष्ठ (Page) के URL को निर्दिष्ट करती है जिस पर लिंक जाता है।
For Example:
<a href="https://sketchyknowledges.space/">Visit sketchy</a>src Attribute
HTML पेज में इमेज अंतर्निहित (Embed) करने के लिए <img> Tag का उपयोग किया जाता है।
src Attribute प्रदर्शित होने वाली छवि का पाथ (Path) निर्दिष्ट करती है।
For Example:
<img src="sketchy_power.jpg">Two Ways To Specify The src Attribute:
src Attribute में URL निर्दिष्ट करने के दो तरीके हैं:
Absolute URL
Relative URL
01. Absolute URL
किसी अन्य वेबसाइट पर Hosted की गई बाहरी छवि (External Images) के लिंक।
For Example :
src="https://sketchyknowledges.space/images/sketchy_power.jpg".02. Relative URL
वेबसाइट के भीतर Hosted की गई छवि (Image) के लिंक। यहां, URL में डोमेन नाम शामिल नहीं है। यदि URL बिना स्लैश (/) के शुरू होता है, तो यह वर्तमान पृष्ठ के सापेक्ष होगा।
For Example:
src="sketchy_power.jpg"यदि URL स्लैश (/) से शुरू होता है, तो यह डोमेन के सापेक्ष होगा।
For Example:
src="/images/sketchy_power.jpg"📝Note:- सापेक्ष URL का उपयोग करना लगभग हमेशा सर्वोत्तम होता है। यदि आप डोमेन बदलते हैं तो वे नहीं टूटेंगे।
width & hight Attributes
<img> Tag में चौड़ाई और ऊंचाई Attributes भी होती हैं।
जो छवि (Image) की चौड़ाई और ऊँचाई को निर्दिष्ट करती है। (px में )
आप चित्र की width और height को पिक्सेल (px) या उसके वास्तविक आकार के प्रतिशत (%) के आधार पर भी सेट कर सकते है ।
For Example :
<img src="sketchy_power.jpg" width="250" height="350">alt Attribute
<img> Tag के लिए alt Attribute बहुत ही आवश्यक होता हैं।
यह किसी छवि (Image) के लिए एक वैकल्पिक टेक्स्ट निर्दिष्ट ( Specify alternate text ) करती है।
यदि किसी कारण से छवि प्रदर्शित नहीं की जा सकती है। यह धीमे कनेक्शन, या src Attribute में त्रुटि के कारण हो सकता है, या यदि उपयोगकर्ता स्क्रीन रीडर का उपयोग करता है।
For Example :
<img src="sketchy_power.jpg" alt="sketchy is a power of knowledge">देखें कि क्या होता है यदि हम एक ऐसी छवि प्रदर्शित करने का प्रयास करते हैं जो मौजूद नहीं है:
<img src="sketchy_inability.jpg" alt="sketchy is a power of knowledge"> Output :
sketchy is a power of knowledgeGlobal Attributes ( वैश्विक गुण )
वैश्विक Attributes में सभी Html तत्वों (Elements) के लिए सामान्य Attributes हैं।
उनका उपयोग सभी तत्वों (Elements) पर किया जा सकता हैं, हालाँकि कुछ तत्वों (Elements) पर कोई प्रभाव नहीं हो सकता हैं।
सामान्य वैश्विक (Global) Attributes id, title, class और style हैं।
id Attribute का उपयोग किसी दस्तावेज़ के भीतर किसी तत्व (Elements) को एक अद्वितीय नाम या पहचानकर्ता देने के लिए किया जाता हैं।
title Attributes का उपयोग किसी तत्व (Elements) या उसकी सामग्री के बारे में सलाहकार पाठ प्रदान करने के लिए किया जाता हैं।
तत्वों (Elements) की पहचान के लिए id Attributes जैसे; class Attributes का उपयोग किया जाता हैं। लेकिन id के विपरीत, दस्तावेज़ में class Attributes का अद्वितीय होना आवश्यक नहीं होता हैं।
style Attributes आपको CSS Styling नियम जैसे ; color, font, border आदि निर्दिष्ट करने की अनुमति देती हैं।
id Attributes
किसी तत्व (Element) के लिए एक अद्वितीय id निर्दिष्ट करता है।
id Attribute का उपयोग किसी दस्तावेज़ के भीतर किसी तत्व (Elements) को एक अद्वितीय नाम या पहचानकर्ता देने के लिए किया जाता हैं।
इससे CSS या JavaScipt का उपयोग करके Element (तत्व) का चयन (Selection) करना आसान हो जाता हैं।
For Example : Good
<p id="infoText">This is my first paragraph.</p>📝Note:- किसी एक दस्तावेज़ में किसी Element (तत्व) की id अद्वितीय होनी चाहिए। एक ही दस्तावेज़ में दो Elements (तत्वों) को एक ही id से नामित नहीं किया जा सकता हैं। और प्रत्येक Element में केवल एक ही id हो सकती हैं।
For Example : Bad
<p id="infoText">This is my first paragraph.</p>
<p id="infoText">This is my second paragraph.</p>Always Use Lowercase Attributes
HTML मानक को Lowercase Attribute नामों की आवश्यकता नहीं है।
title Attribute ( और अन्य सभी Attribute ) को Uppercase या Lowercase . जैसे title या TITLE के साथ लिखा जा सकता है।
W3C HTML में Lowercase Attributes की सिफारिश करता है।
XHTML जैसे सख्त दस्तावेज़ प्रकारों के लिए Lowercase Attributes की माँग करता है।
My Suggestion : मेरा सुझाव हैं कि आप Lowercase Attributes का ही उपयोग करेंगे।
Always Quote Attribute Values
HTML मानक को Attribute मानों के आसपास उद्धरणों ( Quotes Value ) की आवश्यकता नहीं होती है।
W3C HTML में उद्धरणों (Quotes) की अनुशंसा करता है, और XHTML जैसे कठोर दस्तावेज़ प्रकारों के लिए उद्धरणों (Quotes) की मांग करता है।
For Example : Good
<a href="https://www.w3schools.com/html/">Visit My HTML tutorial</a>निम्नलिखित इस उदाहरण में Double Quotes का उपयोग किया गया है, जो कि सहीं तरीका हैं।
For Example : Bad
<a href=https://www.w3schools.com/html/>Visit My HTML tutorial</a>निम्नलिखित इस उदाहरण में Double Quotes का उपयोग नहीं किया गया है, जो कि सहीं तरीका नहीं हैं।
Single or Double Quotes? ( एकल और दोहरे उद्धरण )
Attribute मानों के आसपास दोहरे उद्धरण (Double Quote) HTML में सबसे आम हैं, लेकिन एकल उद्धरणों ( Single Quote ) का भी उपयोग किया जा सकता है।
कुछ स्थितियों में, जब Attribute मान में ही दोहरे उद्धरण (Double Quote) होते हैं, तो एकल उद्धरणों ( Single Quote ) का उपयोग करना आवश्यक होता है।
For Example :
<p title='Sanju "Sketchy" Dhritlahre'> My Name </p>For Example :
<p title="Sanju 'Sketchy' Dhritlahre"> My Name </p>
Conclusion ( निष्कर्ष )
सभी HTML तत्वों ( Elements ) में Attributes हो सकती हैं।
<a> की href Attribute उस पृष्ठ के URL को निर्दिष्ट करती है जिस पर लिंक जाता है।
<img> की src Attribute प्रदर्शित होने वाली छवि का मार्ग (Path) निर्दिष्ट करती है।
<img> की width (चौड़ाई) और hight (ऊंचाई) Attribute छवियों के लिए आकार की जानकारी प्रदान करती हैं।
<img> की alt Attribute एक छवि के लिए एक वैकल्पिक पाठ प्रदान करती है।
style (शैली) Attribute का उपयोग किसी तत्व (Element) में Styles (शैलियों) को जोड़ने के लिए किया जाता है, जैसे कि color, font, size, और बहुत कुछ इसके द्वारा किया जाता हैं।
<html> Tag की lang Attribute वेब पेज की भाषा घोषित करती है, जिसमें में हम किसी भी देश की भाषा को निर्दिष्ट कर सकते हैं।
title Attribute तत्व (Element) के बारे में कुछ अतिरिक्त जानकारी को परिभाषित करती है।
उम्मीद करता हूँ कि दोस्तों मेरा यह Html Attribute पर बनी सुन्दर-सा पोस्ट आपको पसंद आया होगा। अगर आपके मन में कोई डाउट या सवाल हैं तो निःसंदेह आप मुझसे सवाल कर सकते हैं। मै इसका जवाब देने का प्रयास करूँगा या फिर मै आपके द्वारा पूछे गए सवाल पर एक नया पोस्ट तैयार जरूर करुँगा। और आप किस-किस विषयों पर अपना ज्ञान पाना चाहते हैं , वो आप मुझे Comments करके जरूर बताये।
_edited.jpg)
Comments