3. HTML Tags Overview

I. Introduction (Tags kya hote hain?)

Explanation: HTML tags wo special keywords hote hain jo web page ka structure aur formatting define karte hain. Har tag angle brackets < > ke andar likha jata hai. Example ke liye <p> ek paragraph start karta hai.

Tags ke bina browser ko ye samajhna mushkil hota hai ki text, image, ya button ko kaise dikhana hai.

II. Types of Tags (Paired, Self-closing)

Explanation: Tags mainly do tarah ke hote hain:

Paired Tags: Ye opening aur closing dono hote hain. Jaise <b>Bold Text</b>.
Self-closing Tags: Inhe close karne ki jarurat nahi hoti. Ye khudme complete hote hain. Jaise <br> line break ke liye.

III. Nesting Rules aur Case Sensitivity

Explanation:

Nesting: Jab ek tag ke andar doosra tag lagaya jata hai to is process ko nesting kehte hain. Nesting me hamesha jo tag baad me open hua hai, usko pehle close karte hain (LIFO - Last In First Out).
Case Sensitivity: HTML tags case-insensitive hote hain, yaani <HTML> ya <html> dono chalega. Lekin best practice hai ki hamesha lowercase ka use karein.

IV. Basic Formatting Tags

Explanation: Formatting tags ka use text ko style karne ke liye hota hai, jaise bold, italic, underline wagairah. Ye tags content ko visually alag banate hain bina CSS ke.

<b> - Bold Text

Explanation: <b> tag se text bold dikhai deta hai, jisse important content highlight hota hai.

<i> - Italic Text

Explanation: <i> tag ka use text ko italic (slanted) style dene ke liye hota hai, jaise kisi dialogue ya special word ke liye.

<u> - Underlined Text

Explanation: <u> tag se text ke neeche ek underline aata hai. Important ya clickable content dikhane ke liye use hota hai.

<mark> - Highlighted Text

Explanation: <mark> tag text ko yellow highlight karta hai jaise hum important notes me karte hain.

<small> - Smaller Text

Explanation: <small> tag se text ka size thoda chhota ho jata hai, jaise copyright notice ke liye.

<del> - Deleted Text

Explanation: <del> tag dikhata hai ki koi text delete kiya gaya hai, usually ek line text ke upar aa jati hai (strikethrough).

<ins> - Inserted Text

Explanation: <ins> tag batata hai ki koi text insert ya add kiya gaya hai. Browser generally us text ko underline karta hai.

<sub> - Subscript Text

Explanation: <sub> tag se text chhota ho jata hai aur niche shift ho jata hai. Mostly chemical formulas me use hota hai (H₂O).

<sup> - Superscript Text

Explanation: <sup> tag se text chhota aur upar shift hota hai. Jaise mathematical power (a² + b² = c²).

V. Text Level Tags

Explanation: Text level tags ka use hum normal paragraphs, breaks, horizontal lines aur pre-formatted text ke liye karte hain. Ye basic structure banane me madad karte hain.

<p> - Paragraph

Explanation: <p> tag ka use ek paragraph banane ke liye hota hai. Browser automatically thoda space add karta hai paragraph ke aage aur baad me.

<br> - Line Break

Explanation: <br> tag se text me new line insert hoti hai bina naye paragraph banaye. Ye self-closing tag hota hai.

<hr> - Horizontal Rule

Explanation: <hr> tag ek horizontal line draw karta hai jo content ke sections ko visually alag karta hai. Ye bhi self-closing tag hai.

<pre> - Preformatted Text

Explanation: <pre> tag ke andar jo text hota hai wo exactly waise hi display hota hai jaise likha gaya ho, including spaces aur line breaks. Programming code dikhane ke liye useful hai.

VI. Heading Tags

Explanation: Heading tags ka use hum headings aur subheadings banane ke liye karte hain. HTML me total 6 heading tags hote hain: <h1> se leke <h6> tak.

Note:

<h1> sabse bada aur important heading hota hai.
<h6> sabse chhota heading hota hai.
SEO ke liye <h1> ka use bahut important hota hai.

VII. List Tags

Explanation: Lists ka use hum items ko sequence me ya points ke form me dikhane ke liye karte hain. HTML me 3 major types ke list tags hote hain:

Unordered List ( <ul> ): Bullets ke saath items aate hain.
Ordered List ( <ol> ): Numbers ya letters ke sequence me items aate hain.
Description List ( <dl> ): Term aur uske description ke pair me items aate hain.

Unordered List Example

Ordered List Example

Description List Example

VIII. Table Tags

Explanation: Table ka use hum data ko rows aur columns ke form me present karne ke liye karte hain.

Table ke main tags:

<table>: Pura table structure.
<tr>: Table row banata hai.
<td>: Table cell/data hota hai (normal data).
<th>: Table header cell hota hai (bold aur center aligned).
<thead>: Table ka header group.
<tbody>: Main table body (rows/data).
<tfoot>: Table ka footer (last part).