HTML Complete Notes (Class 6 to 12) – Basic to Advanced
🔹 HTML क्या है? (Class 6 – Basic)
HTML का पूरा नाम:
👉 Hyper Text Markup Language
HTML क्या करता है?
HTML का उपयोग Website / Web Page बनाने के लिए किया जाता है।
📌 HTML कोई Programming Language नहीं है, यह एक Markup Language है।
HTML से क्या बनाया जा सकता है?
Website
Web Page
Online Form
Blog Page
🔹 HTML का इतिहास (Class 6–7)
HTML की खोज Tim Berners-Lee ने की
HTML का पहला version 1991 में आया
अभी का latest version है HTML5
🔹 HTML File कैसे बनाते हैं? (Class 6)
Notepad खोलें
File → Save As
File name लिखें:
index.htmlSave as type: All Files
Encoding: UTF-8
🔹 HTML का Structure (Class 6–7)
<!DOCTYPE html>
<html>
<head>
<title>My First Page</title>
</head>
<body>
Hello World
</body>
</html>
Structure Explanation:
<!DOCTYPE html>→ HTML5 बताता है<html>→ पूरा HTML page<head>→ Title, CSS, Meta<title>→ Browser tab का नाम<body>→ जो दिखाई देता है
🔹 HTML Tag क्या होता है? (Class 6–7)
HTML Tags से बनी होती है।
Example:
<p>This is paragraph</p>
<p>→ Opening Tag</p>→ Closing Tag
🔹 Common HTML Tags (Class 6–7)
| Tag | काम |
|---|---|
<h1> to <h6> | Heading |
<p> | Paragraph |
<br> | Line break |
<hr> | Horizontal line |
<b> | Bold |
<i> | Italic |
<u> | Underline |
🔹 Heading Tag (Class 6–7)
<h1>Main Heading</h1>
<h2>Sub Heading</h2>
<h3>Small Heading</h3>
🔹 Paragraph & Formatting (Class 7)
<p>This is a paragraph</p>
<b>Bold Text</b>
<i>Italic Text</i>
<u>Underline Text</u>
🔹 HTML Attributes (Class 7–8)
Attribute Tag को extra जानकारी देता है
<p align="center">Hello</p>
Common Attributes:
alignbgcolorcolorwidthheight
🔹 HTML Image Tag (Class 8)
<img src="image.jpg" width="200" height="150">
Attributes:
src→ image pathwidth→ चौड़ाईheight→ ऊँचाई
🔹 HTML Link (Anchor Tag) (Class 8)
<a href="https://google.com">Google</a>
<a>→ Anchor Taghref→ link address
🔹 HTML List (Class 8–9)
Ordered List:
<ol>
<li>Apple</li>
<li>Mango</li>
</ol>
Unordered List:
<ul>
<li>Tea</li>
<li>Coffee</li>
</ul>
🔹 HTML Table (Class 9)
<table border="1">
<tr>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td>Ravi</td>
<td>15</td>
</tr>
</table>
Tags:
<table><tr>→ Row<th>→ Heading<td>→ Data
🔹 HTML Form (Class 9–10)
<form>
Name: <input type="text"><br>
Password: <input type="password"><br>
<input type="submit">
</form>
Input Types:
text
password
radio
checkbox
submit
email
number
🔹 HTML Comment (Class 10)
<!-- This is comment -->
🔹 HTML Block & Inline Elements (Class 10)
Block Elements:
<p><div><h1>
Inline Elements:
<span><a><img>
🔹 HTML Semantic Tags (Class 11 – HTML5)
<header>
<nav>
<section>
<article>
<footer>
फायदा:
Code readable
SEO friendly
🔹 HTML Audio & Video (Class 11)
<audio controls>
<source src="song.mp3">
</audio>
<video controls width="300">
<source src="movie.mp4">
</video>
🔹 HTML iframe (Class 11)
<iframe src="https://google.com"></iframe>
🔹 HTML Meta Tag (Class 12)
<meta charset="UTF-8">
<meta name="description" content="HTML Tutorial">
<meta name="viewport" content="width=device-width">
🔹 HTML vs CSS vs JavaScript (Class 12)
| Language | काम |
|---|---|
| HTML | Structure |
| CSS | Design |
| JS | Logic |
🔹 HTML Project Ideas (Class 9–12)
Student Profile Page
School Website
Resume
Registration Form
Simple Blog Page
✅ Exam Important Questions
HTML क्या है?
HTML Tag और Attribute में अंतर
HTML List के प्रकार
Table बनाने का Syntax
Form क्या है?
HTML NOTES (Class 6 to 12)
HTML kya hai?
HTML ka full form HyperText Markup Language hota hai. Ye ek markup language hai jiska use website aur web pages banane ke liye kiya jata hai. HTML se hum webpage ka structure tayar karte hain.
Example: Text, Image, Link, Table, Form, Video etc.
CLASS 6 – HTML BASICS
1. Website aur Webpage
Website: Webpages ka group
Webpage: Internet par ek single page
2. HTML File
HTML file ka extension hota hai:
.htmlExample:
index.html
3. HTML Tag
Tag angle brackets me hota hai:
< >Example:
<html>,<body>
4. Basic HTML Structure
CLASS 7 – TEXT & FORMATTING TAGS
1. Heading Tags
<h1>se<h6>tak
2. Paragraph Tag
<p>paragraph ke liye
3. Formatting Tags
<b>Bold<i>Italic<u>Underline<br>Line break<hr>Horizontal line
CLASS 8 – LISTS & IMAGES
1. List
Ordered List
Unordered List
2. Image Tag
CLASS 9 – LINKS & TABLES
1. Anchor Tag (Link)
2. Table
CLASS 10 – FORMS
1. Form Tag
Input Types
text
password
radio
checkbox
submit
CLASS 11 – HTML ATTRIBUTES & MULTIMEDIA
1. Attributes
src,href,width,height,alt
2. Audio & Video
CLASS 12 – HTML5 ADVANCED
1. HTML5 Tags
<header><footer><section><article><nav>
2. iframe
3. Meta Tag
HTML ke Fayde
Simple aur easy
Platform independent
Har browser support karta hai
Interview / Exam Tips
HTML case-insensitive hoti hai
HTML programming language nahi hai
HTML structure yaad rakhna bahut zaroori hai
Prepared by: Ranjan Kumar Sharma
Post a Comment