HTML

HTML क्या है? – Vision Computer Classes

HTML (HyperText Markup Language) एक मार्कअप भाषा है, जिसका उपयोग वेब पेज और वेब एप्लिकेशन बनाने के लिए किया जाता है। यह वेब पेज की संरचना को परिभाषित करता है और टेक्स्ट, इमेज, वीडियो आदि को व्यवस्थित करने के लिए टैग्स का उपयोग करता है। Vision Computer Classes में हम छात्रों को HTML और CSS का गहन ज्ञान प्रदान करते हैं ताकि वे वेब डिज़ाइनिंग के क्षेत्र में निपुण बन सकें।

HTML का आविष्कार और इतिहास

• आविष्कारक: Tim Berners-Lee ने 1989 में HTML का आविष्कार किया।
• पहला संस्करण: 1993 में HTML 1.0 जारी किया गया।
• इसके बाद HTML 2.0, HTML 3.2, HTML 4.01 और वर्तमान में HTML5 उपयोग में है।

HTML की विशेषताएँ

1. सरल और आसान: HTML को समझना और उपयोग करना आसान है।
2. प्लेटफ़ॉर्म स्वतंत्र: किसी भी ब्राउज़र पर HTML पेज देखा जा सकता है।
3. हाइपरलिंकिंग: यह एक पेज से दूसरे पेज को लिंक करने में सक्षम है।
4. मल्टीमीडिया सपोर्ट: इमेज, वीडियो और ऑडियो को वेब पेज पर एम्बेड कर सकता है।
5. सेमांटिक टैग्स: HTML5 में सेमांटिक टैग्स की सुविधा है, जो SEO के लिए उपयोगी हैं।

HTML टैग्स का परिचय

HTML में हर तत्व को टैग्स के माध्यम से परिभाषित किया जाता है। हर टैग एक विशेष कार्य करता है।

HTML टैग्स की संरचना:

• Opening Tag: <tagname>
• Content: टैग के बीच की सामग्री।
• Closing Tag: </tagname>

उदाहरण:

HTML का बेसिक स्ट्रक्चर

हर HTML डॉक्यूमेंट में निम्नलिखित संरचना होती है:

महत्वपूर्ण HTML टैग्स की सूची

1. हेडिंग टैग्स:

   • <h1> से <h6> तक हेडिंग को परिभाषित करते हैं।
   • उदाहरण:
   html

   CopyEdit

   <h1>Main Heading</h1> <h2>Sub Heading</h2>

2. पैरा टैग:

   • <p> टैग का उपयोग पैराग्राफ बनाने के लिए किया जाता है।
   html

   CopyEdit

   <p>This is a paragraph.</p>

3. लिंक टैग:

   • <a> टैग का उपयोग हाइपरलिंक बनाने के लिए किया जाता है।
   html

   CopyEdit

   <a href="https://www.visioncomputer.co.in">Visit Vision Computer Classes</a>

4. इमेज टैग:

   • <img> टैग का उपयोग इमेज जोड़ने के लिए होता है।
   html

   CopyEdit

   <img src="image.jpg" alt="Sample Image">

5. लिस्ट टैग:

   • अनऑर्डर्ड लिस्ट: <ul>
   • ऑर्डर्ड लिस्ट: <ol>
   • लिस्ट आइटम: <li>
   html

   CopyEdit

   <ul> <li>HTML</li> <li>CSS</li> </ul>

6. टेबल टैग:

   • <table>, <tr>, <td>, <th> का उपयोग टेबल बनाने के लिए होता है।
   html

   CopyEdit

   <table border="1"> <tr> <th>Name</th> <th>Age</th> </tr> <tr> <td>Rahul</td> <td>25</td> </tr> </table>

HTML5 सेमांटिक टैग्स

HTML5 में सेमांटिक टैग्स जोड़े गए हैं, जो वेब पेज को अधिक स्पष्ट और SEO फ्रेंडली बनाते हैं।

• <header>
• <nav>
• <section>
• <article>
• <footer>

CSS क्या है?

CSS (Cascading Style Sheets) का उपयोग HTML पेज की स्टाइलिंग के लिए किया जाता है। यह वेब पेज को आकर्षक बनाने में मदद करता है।

CSS जोड़ने के तरीके:

1. इनलाइन CSS:

   html

   CopyEdit

   <p style="color: red;">This is a red text.</p>

2. इंटरनल CSS:

   html

   CopyEdit

   <style> p { color: blue; } </style>

3. एक्सटर्नल CSS:

   html

   CopyEdit

   <link rel="stylesheet" href="style.css">

CSS के मुख्य गुण (Properties)

1. Background Color:

   css

   CopyEdit

   body { background-color: lightgray; }

2. Text Color:

   css

   CopyEdit

   h1 { color: green; }

3. Font Size:

   css

   CopyEdit

   p { font-size: 16px; }

4. Padding और Margin:

   css

   CopyEdit

   div { padding: 10px; margin: 20px; }

5. Border:

   css

   CopyEdit

   table { border: 2px solid black; }