HTML Attributes In Hindi | Visheshtaen | Mayank Salvi

HTML attributes HTML elements के बारे में additional information provide करती हैं।

HTML Attributes


HTML attributes HTML elements के बारे में additional information provide करती हैं।





HTML Attributes

सभी HTML elements में attributes हो सकते हैं

Attributes elements के बारे में additional information provide करते हैं

Attributes हमेशा start tag में निर्दिष्ट(specify) की जाती हैं

Attributes आमतौर पर name/value के जोड़े में आते हैं जैसे: name="value"


The href Attribute

<a> tag हाइपरलिंक define करता है। href attribute पेज लिंक का URL specifies करता है:

Example


<a href="https://www.mayanksalvi.blogspot.com">Visit My Blog</a>
            
Copy Code

The src Attribute

<img> tag एक HTML page में एक image embed करने या जोड़ने के लिए प्रयोग किया जाता है। src यह attribute image display करने के लिए image का path specify करता है:

Path: का सीधा अर्थ यह है कि वह location जहां हमारा source मौजूद है! 

Example


<img src="img_girl.jpg">
            
Copy Code

src attribute में URL specify करने के दो तरीके हैं :

1. Absolute URL - किसी अन्य वेबसाइट पर होस्ट की गई बाहरी(external) image के Links! उदाहरण: src="https://www.mayanksalvi.blogspot.com/images/img_girl.jpg"।

नोट: External images कॉपीराइट के अंतर्गत हो सकते हैं। यदि आपको इसका उपयोग करने की अनुमति नहीं मिलती है, तो आप कॉपीराइट कानूनों का उल्लंघन कर सकते हैं। इसके अतिरिक्त, आप External images को control नहीं कर सकते हैं; इसे अचानक हटाया या बदला जा सकता है।

2. Relative URL - वेबसाइट के भीतर होस्ट की गई छवि के लिंक को Relative URL कहते हैं। यहाँ, URL में  domain name शामिल नहीं है। यदि URL बिना स्लैश के शुरू होता है, तो यह current page के relative होगा। 

उदाहरण: src="img_girl.jpg"। 

यदि URL स्लैश से शुरू होता है, तो यह domain के relative होगा। 

उदाहरण: src="/images/img_girl.jpg"।

Tip: relative URLs का उपयोग करना लगभग हमेशा best होता है। यदि आप domain बदलते हैं तो कोई problem नहीं होती।

The width and height Attributes

<img> tag width और height attributes भी शामिल करना चाहिए, जो image की width और height specify करत है (pixels में):

Example


<img src="img_girl.jpg" width="500" height="600">
            
Copy Code

The alt Attribute

alt यह <img> tag का एक optional attribute है। यदि किसी कारण से Image display नहीं की जा सकती है तब alt attribute में दी गई value उस image की जगह पर show होगी। Image show न हो यह slow connection, या src attribute में error के कारण हो सकता है , या यदि user screen reader का उपयोग करता है।

Example


<img src="img_girl.jpg" alt="Girl with a jacket">
            
Copy Code

Example


<img src="img_typo.jpg" alt="here my logo">
            
Copy Code

The style Attribute

style attribute को प्रयोग किसी element को style करने के लिये किया जाता है। जैसे element का color, font, size, और आदि change करने के लिये किया जाता है।

नीचे दिये गये उदाहरण में peragraph का color red किया गया है जो कि पहले से black होता है।

Example


<p style="color:red;">This is a red paragraph.</p>
            
Copy Code

The lang Attribute

वेब पेज की भाषा declare करने के लिए आपको हमेशा <html> tag के अंदर lang attribute add करना चाहिए । यह search engines ओर browsers की सहायता करने के लिए है।

निम्नलिखित उदाहरण अंग्रेजी को भाषा के रूप में specify करता है:

Example


<!DOCTYPE html>
<html lang="en">
<body>
...
</body>
</html>
            
Copy Code

 

lang attribute में language code में country codes भी जोड़े जा सकते हैं । तो, पहले दो अक्षर HTML page की भाषा को परिभाषित करते हैं, और अंतिम दो characters देश को परिभाषित करते हैं।

निम्नलिखित उदाहरण en को भाषा के रूप में और US को देश के रूप में निर्दिष्ट करता है:

Example


<!DOCTYPE html>
<html lang="en-US">
<body>
...
</body>
</html>
            
Copy Code

The title Attribute

Title attribute एक element के बारे में कुछ extra information परिभाषित करता है।

जब आप element पर माउस ले जाते हैं तो title element की value  tooltip के रूप में display होती है:

Example


<p title="I'm a tooltip">This is a paragraph.</p>
            
Copy Code

हम सुझाव देते हैं: हमेशा Lowercase Attributes का प्रयोग करें

HTML standard को lowercase में attribute के नामों की आवश्यकता नहीं है।

title attribute (और अन्य सभी attributes) को uppercase या lowercase जैसे title या TITLE के साथ लिखा जा सकता है ।

हालाँकि, हम HTML में lowercase attributes को recommend करते है, और XHTML जैसे सख्त(stricter) documents lowercase attributes की माँग करते हैं ।

हम हमेशा lowercase में attribute के नामों का उपयोग करते हैं।


हम सुझाव देते हैं: हमेशा Attribute Values को Quote में लिखा करें

HTML standard को attribute values के आसपास quotes चिह्नों की आवश्यकता नहीं होती है।

हालांकि, हम HTML में quotes को recommends करते हैं, और XHTML जैसे सख्त(stricter) documents quotes की माँग करते हैं ।

Good:


<a href="https://www.mayanksalvi.blogspot.com/html/">Visit our HTML tutorial</a>
            
Copy Code

Bad:


<a href=https://www.mayanksalvi.blogspot.com/html/>Visit our HTML tutorial</a>
            
Copy Code

 

कभी-कभी आपको quotes का उपयोग करना पड़ता है। यह उदाहरण title attribute को सही ढंग से प्रदर्शित नहीं करेगा, क्योंकि इसमें एक space है:

Example


<p title=About Mayank>
            
Copy Code

हम हमेशा attribute values के आसपास quotes चिह्नों का उपयोग करते हैं।

Single or Double Quotes?

attribute values के आसपास double quotes HTML में सबसे common हैं, लेकिन single quotes का भी उपयोग किया जा सकता है।

कुछ स्थितियों में, जब attribute value में ही double quotes होते हैं, तो single quotes का उपयोग करना आवश्यक होता है:

Example


<p title='Hi, i am "Mayank"'>
            
Copy Code

या ठीक इसके विपरीत:

Example


<p title="Hi, i am 'Mayank'">
            
Copy Code

 

Chapter Summary

  • सभी HTML elements में attributes हो सकते हैं
  • <a> का href attribute उस page के URL को specify करता है जिस पर लिंक जाता है
  • <img> का src attribute display होने वाली image का path specify करता है
  • <img> के Width और height attributes images के लिए size information provide करता है
  • <img> का alt attribute एक image के लिए एक optional text provide करता है
  • Style attribute का प्रयोग elements को style करने के लिये किया जाता है जैसे- color, font, size आदि
  • <html> tag की lang attribute वेब पेज की भाषा declare करती है
  • Title attribute एक element के बारे में कुछ  extra information को परिभाषित करता है


Also Read: 

Complete HTML Series In Hindi:  Click Here