HTML Attributes Kya Hote Hain? 

Jab bhi hum HTML elements likhte hain, toh unhe customize karne ke liye attributes ka use karte hain. Attributes ek element ke andar extra information dete hain, jo element ka behavior, value, ya appearance define karta hai.

Basic Format of an HTML Attribute

<tagname attribute="value">Content</tagname>

Example:

<a href="https://google.com">Google</a>

Yahan href ek attribute hai jo batata hai ki link kahan le jaayega. https://google.com uski value hai.

Commonly Used HTML Attributes

1. href: Links ke liye

<a href="https://youtube.com">YouTube</a>

Yeh link ko kisi URL par redirect karta hai.

2. src: Images ke liye

<img src="image.jpg" alt="My Image" />

src batata hai image ka source (path). Without it, image dikhegi hi nahi.

3. alt: Image not found hone par

<img src="logo.png" alt="Company Logo" />

Agar image load nahi hui, toh alt text dikhega. SEO ke liye bhi useful hai.

4. style: Inline CSS

<p style="color: blue; font-size: 18px;">Hello!</p>

Ye paragraph ko styling dega isse text-color "blue" ho jayega aur font-size "18px".

5. title: Tooltip

<p title="Do Hover">Mouse Hover Here</p>

Jab user hover karega, ek chhota pop-up text dikhega.

6. target: Link new tab mein khulega

<a href="https://instagram.com" target="_blank">Instagram</a>

_blank ka matlab link new tab mein khulega.

Global HTML Attributes

1. id: Unique Identity

<p id="intro">Welcome to my website!</p>

id se ham har element ko uniquely identify karte hai. id ka use javaScript aur CSS mein element ko target karne ke liye use kiya jaata hai jisse ham us par styling aur logic apply kar sake. Har element ki id unique hogi, kisi ki bhi two or more than two elements ki id same nhi ho sakti. Agar two or more than two elements ko same id deni hai to ham class ka use karte hai.

2. class: Grouping Elements

<p class="highlight">Yeh special paragraph hai</p>

class se multiple elements ko ek hi designing aur behavior de sakte hain using CSS and JS. Jab bhi hame elements ko common styling aur logic apply karna hota hai to ham class's ka use karte hai.

3. style: Inline CSS

<h2 style="color: green;">Hello!</h2>

Jab bhi ham web page ko design karte hai to ham ek specific file banate hai called style.css isi ke andar saari styling karte hai lekin agar hame kisi specific element ko design karna hai ya poore web page ko bhi to ham directly element ke andar CSS likh sakte hai this is called inline CSS.

4. hidden – Element Ko hide karne ke liye

<p hidden>This content is not visible</p>

hidden attribute se ham element ko hide kar dete hai jisse browser par ye visible nhi hota lekin code mein hota hai. Ab aap sochogo ki ham kisi element ko hide kyu karenge ? code hi remove kar denge, lekin nhi kuch element hote hai jo ham initially hide rakhte lekin koi logic trigger hone par ham unhe visible kar dete hai. Jaise websites mein hamburger ka code, ye initially hide rehta hai kioki agar website laptop ya desktop par opne karte hai to hamburger ki need nhi hoti lekin agar website phone par open hoti hai to hamburger ki need hoti hai. Pehle device ka screen size check hota hai agar hamburger ki need hoti hai to use visible kar denge nhi to hidden hi rakhte hai.

8. contenteditable – Editable Banata Hai

<div contenteditable="true">Is text ko edit karo</div>

Browser mein user yeh text edit kar sakta hai.

Important Points

1. Attributes hamesha start tag ke andar hote hain.
2. Format hota hai: name="value"
3. Ek hi element ke andar multiple attributes ho sakte hain.

Bonus: HTML Input Attributes

Form elements mein bhi attributes use hote hain:

<input type="text" placeholder="Enter Your Name" required />

• type – input type batata hai
• placeholder – hint dikhata hai

required – form submit hone ke liye zaroori bana deta hai