Html
एचटीएमएल एक (हाइपरटेक्स्ट मार्कअपलैंग्वेज) एक मानक मार्कअप लैंग्वेज है. जिसका उपयोग वेब पेज को वेब ब्राउज़र में स्ट्रक्चर डिस्प्ले और वेब पेज बनाने के लिए किया जाता है। एचटीएमएल एक वेब पेज प्रीव्यू संरचना प्रदान करता है, और एक डेवेलोप वेब पेज पेज के अंदर वेब कंटेंट और सामग्री निर्दिष्ट करता है। एचटीएमएल का अवलोकन एचटीएमएल पॉपुलर टैग्स से बने होते हैं. जो एंगुलर कोष्ठक (<>) से प्रदर्शित होते हैं, और वेब पेज सामग्री की संरचना और स्वरूप निर्धारित होते हैं।

Html Basic Syntax.
<!DOCTYPE html>
<html>
<head>
<title>Set your web page title</title>
</head>
<body>
<h1>Set Your Web Page Heading </h1>
<p>Add some paragraph text</p>
</body>
</html>
Let’s explore each and every components of above HTML example.
- <!DOCTYPE html> – doctype एचटीएमएल घोषणा या निर्दिष्ट करती है, कि वर्त्तमान में आप किस एचटीएमएल संस्करण का उपयोग कर रहे है. जो कि वर्त्तमान में नवीनतम एचटीएमएल5 संस्करण डिफ़ॉल्ट है।
- <html> – एचटीएमएल वेब पेज में किसी एचटीएमएल दस्तावेज़ की एचटीएमएल फ़ाइल कोर संरचना या मूल तत्व से शुरू किया जाता है। अन्य सभी एचटीएमएल वेब पेज टैग और तत्व इसमें समाहित हैं।
- <head> – head टैग सक्रिय वेब पेज में हेड शीर्षक प्रदर्शित करते है. इसके अतिरिक्त वेब पेज जैसे शीर्षक, शामिल अप्लाई सीएसएस स्टाइलशीट और सीएसएस स्क्रिप्ट आदि को जोड़ सकते है।
- <title> – आप अपने वर्त्तमान वेब पेज का शीर्षक सेट कर सकते हैं. जो आपके वेब ब्राउज़र के शीर्षक बार या टैब में डिफ़ॉल्ट प्रदर्शित होता है।
- <body> – आप एचटीएमएल वेब पेज की मुख्य सामग्री या अप्लाई सभी एचटीएमएल टैग एलिमेंट्स को इस बॉडी तत्व के भीतर रख सकते हैं।
- <h1> – वर्त्तमान वेब पेज में हैडिंग शीर्षक प्रदर्शित करें और पृष्ठ पर शीर्षक या शीर्षकों के लिए उपयोग किया जाता है।
- <p> – किसी भी वेब पेज में टेक्स्ट का एक पैराग्राफ बनाएं या मल्टीप्ल पैराग्राफ टैग टेक्स्ट को परिभाषित करें।
Blink html
<blink> टैग एचटीएमएल के शुरुआती संस्करणों में पेश किया गया था, और इस टैग का उपयोग किसी भी वेब पेज पर टेक्स्ट या तत्वों को ब्लिंक इफ़ेक्ट चालू और बंद करने के लिए किया जाता था। हालाँकि, इसे नए एचटीएमएल वर्शन में पूरी तरह से हटा दिया गया है, और अब एचटीएमएल 5 सहित आधुनिक एचटीएमएल टैग्स स्टैंडर्ड्स में इस टैग का समर्थन नहीं किया गया है। यह टैग यूजर के ध्यान को आकर्षित करने और ध्यान को भटकाने के रूप में अधिक प्रचलित हो गया था।
Html Tag.
<div class=”blink”>This text blinks! </div>
वर्त्तमान में आप <ब्लिंक> टैग का उपयोग करने के बजाय, समान प्रभाव प्राप्त करने के लिए सीएसएस स्टाइलशीट एनिमेशन या जावास्क्रिप्ट का उपयोग कर सकते है.
Html comment
एचटीएमएल में आप अपने डिज़ाइन वेब पेज कोड के भीतर किसी पर्टिकुलर टैग के बारे में नोट्स या स्पष्टीकरण जोड़ने के लिए कमैंट्स का उपयोग कर सकते हैं. जो पेज के वेब ब्राउज़र में रेंडर होने पर वेब ब्राउज़र में प्रदर्शित नहीं होते हैं। कमेंट किसी भी एचटीएमएल वेब पेज टिप्पणियाँ आपके कोड का दस्तावेज़ीकरण करने या कुछ अनुभागों को के बारे में विशेष जानकारी जानने के लिए उपयोग किये जाते हैं।
Let’s now you can write HTML comments.
Html Single-line comment.
html code
<! — This is a single-line comment –>
Html Multi-line comment.
html code
<!–
This is a
multi-line comment
–>
Html Example
<!DOCTYPE html>
<html>
<head>
<title>Set your web page title</title>
</head>
<body>
<h1>Set Your Web Page Heading </h1> <! — This is a single-line html comment –>
<p>Add some paragraph text</p>
<!–
This is a
multi-line html comment
–>
</body>
</html>
Html button
किसी भी एचटीएमएल वेब पेज में एक बटन बनाने के लिए, आप एचटीएमएल <button> टैग का उपयोग करते हैं। बटन टैग से आप ओके, कैंसिल, सबमिट, रिसेट, आदि प्रकार के फॉर्म बटन बना सकते है.
This are the example of how to create a basic button in html.
Html button code.
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<button>Submit</button> <! —- Submit button created….>
<button>Cancel</button> <! —- Cancel button created….>
</body>
</html>
Html table
एचटीएमएल वेब पेज में टेबल किसी वेबपेज पर सारणीबद्ध रौ और कॉलम में डेटा और डिजिटल इनफार्मेशन प्रदर्शित करने का एक संरचित तरीका है। इसमें टेबल रौ कॉलम ग्रिड जैसी संरचना में व्यवस्थित पंक्तियाँ और स्तंभ होते हैं। टेबल्स <table> तत्व और उसके संबंधित तत्वों जैसे कि तालिका पंक्तियों के लिए <tr>, तालिका शीर्षलेखों के लिए <th> और तालिका सैल्स के लिए <td> का उपयोग करके बनाई जाती हैं।
Let’s analyze the main components of an HTML table.
- <table> – एचटीएमएल में तालिका टैग का उपयोग संपूर्ण तालिका डिजिटल डिस्प्ले इनफार्मेशन के लिए कंटेनर के रूप में किया जाता है।
- <tr> – टेबल में tr का मतलब टेबल पंक्ति है। यह तालिका के भीतर कई पंक्तियों को परिभाषित करता है।
- <th> – टेबल में th एक टेबल हेडर सेल का प्रतिनिधित्व करता है। इसका उपयोग कॉलम या पंक्तियों के शीर्षकों को परिभाषित करने के लिए किया जाता है।
- <td> – टेबल में td एक मानक तालिका डेटा सेल का प्रतिनिधित्व करता है। इसमें तालिका का वास्तविक डेटा या सामग्री शामिल है।
Html example
<table bgcolor= grey border=1>
<tr>
<th>#</th>
<th>Programming</th>
<th>Duration</th>
</tr>
<tr>
<td>1. </td>
<td>Html</td>
<td>1 Month</td>
</tr>
<tr>
<td>2. </td>
<td>Html 5</td>
<td>2 Month</td>
</tr>
</table>
Html link
Below is an example of creating a basic web page link in html.
HTML link code.
<a href=”https://vcanhelpsu.com”>open this website</a>
यहाँ ऊपर दिए गए उदाहरण में, लिंक <a> टैग के साथ बनाया गया एक लिंक है। a href टैग की विशेषता उस वेब पेज URL या गंतव्य को निर्दिष्ट करती है. जिस पर क्लाइंट या विजिटर के क्लिक करने पर उस लिंक स्वत ही नेविगेट होगा। इस स्थिति में, इसे “https://vcanhelpsu.com” पर एक लिंक सेट किया गया है। जब भी यूजर इस लिंक पर क्लिक करेगा तब ऊपर वर्णित वेबसाइट इस क्लिक के साथ खुल जाएगी।
Html Link Example
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<a href=”https://vcanhelpsu.com”>Open This Website</a>
</body>
</html>
Html viewer
यदि आप ऑनलाइन और ऑफलाइन एचटीएमएल वेब पेज कोड को प्रदर्शित और प्रस्तुत करने के लिए एचटीएमएल व्यूअर सॉफ्टवेयर की तलाश कर रहे हैं. तो यहाँ निचे आपके पास कुछ प्रमुख एचटीएमएल वेब व्यूअर विकल्प हैं।
- Web browser clients – अधिकांश वर्त्तमान में आधुनिक वेब ब्राउज़र जैसे गूगल क्रोम, मोज़िला फ़ायरफ़ॉक्स, एप्पल सफारी और माइक्रोसॉफ्ट एज, सभी एचटीएमएल कोड या टैग्स का समर्थन करते हैं।
- Integrated Development Environment (IDE) – एचटीएमएल आईडीई के रूप में आप विजुअल स्टूडियो कोड, सबलाइम टेक्स्ट एडिटर, और एटम एचटीएमएल आईडीई जैसे आईडीई विकल्पों को चुन सकते है।
- Online HTML editors – यहाँ आपको कुछ प्रमुख CodePen, JSFiddle, और एचटीएमएल ऑनलाइन, onlinegdb, replit, stackblitz, कुछ लोकप्रिय एचटीएमएल एडिटर्स सॉफ्टवेयर दिए गए हैं।
Html code
This is the basic html code or html document structuring format for every html document.
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
Html to pdf
यदि आप एचटीएमएल फाइल को PDF फाइल में बदलना चाहते हैं. तो आपके पास कुछ विकल्प हैं।
Using a server-side library.
- Python – आप पीडीएफकिट, वीज़ीप्रिंट, या पीईपीडीएफ2 जैसी लाइब्रेरी का उपयोग कर सकते हैं।
- Java – आप फ्लाइंग सॉसर, आईटेक्स्ट, या अपाचे पीडीएफबॉक्स जैसी लाइब्रेरी का उपयोग कर सकते हैं।
- PHP – Dompdf, TCPDF, या mpdf जैसी लाइब्रेरी आमतौर पर उपयोग की जाती हैं।
Using an HTML to PDF API or service.
Some of the popular HTML to PDF conversion services include.
- PDFShift – https://pdfshift.io/
- PDFCrowd – https://pdfcrowd.com/
- DocRaptor – https://docraptor.com/
Html image, html add image
यदि आप एचटीएमएल पेज में एक इमेज प्रदर्शित करना चाहते हैं. तो आप एचटीएमएल वेब पेज में <img> टैग का उपयोग कर सकते हैं।
निचे दिया गया img टैग आपके एचटीएमएल कोड में एक छवि को शामिल करने का एक उदाहरण है।
<img src=”imagename.png” alt=”add image alt description”>
Html img code
<html>
<head>
<title>HTML Img Tag Example</title>
</head>
<body>
<img src=”imagename.png” alt=”add image alt description”>
</body>
</html>
ऊपर दिए गए उदाहरण में, <img> एचटीएमएल टैग का उपयोग एक छवि प्रदर्शित करने के लिए किया जाता है। Src विशेषता यूज़ इमेज का ऑनलाइन URL या फ़ाइल डिफ़ॉल्ट स्टोरेज पथ निर्दिष्ट करती है। यहाँ आपको “imagename.png” को अपनी छवि के वास्तविक इमेज URL या फ़ाइल पथ से बदलना होगा। यहाँ ऑल्ट विशेषता आपके इमेज के बारे में वैकल्पिक टेक्स्ट इनफार्मेशन प्रदान करती है. जो वेब ब्राउज़र में छवि लोड नहीं होने पर या पहुंच-योग्यता उद्देश्यों के लिए प्रदर्शित किया जाएगा।
What is html
एचटीएमएल एक (हाइपरटेक्स्ट मार्कअप लैंग्वेज) एक स्टैण्डर्ड वेब पेज स्ट्रक्टरिंग या वेब डिस्प्ले मार्कअप लैंग्वेज है. जिसका उपयोग एचटीएमएल में डेवलप्ड वेब पेजों की संरचना और सामग्री बनाने के लिए किया जाता है। एचटीएमएल वेब डेवलपर को एचटीएमएल टैग और विशेषताओं का एक सेट प्रदान करता है, जो परिभाषित करता है कि वेब पेज के भीतर एचटीएमएल टैग्स से वेब पेज तत्वों को कैसे प्रदर्शित किया जाना चाहिए और वेब यूजर उनके साथ इंटरैक्ट किया जाना चाहिए।
एचटीएमएल टैग्स दस्तावेज़ों में तत्वों की एक श्रृंखला होती है. जिनमें से प्रत्येक को टैग द्वारा दर्शाया जाता है।एचटीएमएल टैग एंगुलर ब्रैकेट्स (<>) में संलग्न हैं और सामग्री के उद्देश्य और संरचना को दर्शाते हैं। प्रारंभिक एचटीएमएल टैग सामग्री से पहले आता है, और समापन एचटीएमएल टैग उसके बाद आता है। कुछ एचटीएमएल टैग स्वयं बंद हो जाते हैं, और उन्हें एचटीएमएल समापन टैग की आवश्यकता नहीं होती है।
Button html
एचटीएमएल वेब पेज में बटन बनाने के लिए आप एचटीएमएल <button> टैग का उपयोग कर सकते हैं।
Below is an example of a basic button.
html button code
<button>OK</button>
<button>Cancel</button>
ऊपर दिए गए एचटीएमएल कोड में, बटन पर “ओके” और “रद्द करें” टेक्स्ट प्रदर्शित होता है। जब कोई भी एचटीएमएल वेब उपयोगकर्ता इस बटन पर क्लिक करता है. तो यह एक बैकग्राउंड एक्शन को ट्रिगर कर सकता है, या एक निर्दिष्ट विशिष्ट कार्य कर सकता है।
View in html
यदि आप अपनी वेब सामग्री को एचटीएमएल के रूप में देखना चाहते हैं. तो आपको एचटीएमएल दस्तावेज़ कोड को प्रस्तुत करने और प्रदर्शित करने के लिए एक अलग प्रकार के वेब ब्राउज़र की आवश्यकता होगी।
यह इसका सरल उदाहरण है कि आप एक साधारण एचटीएमएल पेज सामग्री कैसे प्रदर्शित कर सकते हैं।
Html code
<!DOCTYPE html>
<html>
<head>
<title>my title</title>
</head>
<body>
<h1>Welcome to the world of html</h1>
<p>This is the simple html paragraph</p>
</body>
</html>
आप इस एचटीएमएल वेब पेज कोड को .html एक्सटेंशन के साथ फ़ाइल के रूप में सहेज सकते हैं। फिर, आप आप इस एचटीएमएल फाइल को मौजूदा गूगल क्रोम, मोज़िल्ला फ़िरेफोक्स, माइक्रोसॉफ्ट एज, एप्पल सफारी, जैसे पॉपुलर वेब ब्राउज़र का उपयोग करके इन एचटीएमएल फ़ाइल को खोल सकते हैं। ये वेब ब्राउज़र आपके एचटीएमएल कोड के अनुसार आउटपुट प्रदर्शित करते हैं।
Html tags
एचटीएमएल (हाइपरटेक्स्ट मार्कअप लैंग्वेज) वेब पेज के तत्वों को संरचना और परिभाषित करने के लिए टैग का उपयोग करता है।
यहाँ आपको कुछ प्रमुख एचटीएमएल वेब पेज डेवलपमेंट के दौरान आमतौर पर उपयोग किए जाने वाले कुछ एचटीएमएल टैग दिए गए हैं।
- <html> – यह मुख्य एचटीएमएल रूट तत्व या टैग है. जो संपूर्ण एचटीएमएल दस्तावेज़ को आपस में एक करता या लपेटता या प्रारंभ करता है।
- <head> – हेड टैग में सक्रिय एचटीएमएल दस्तावेज़ के बारे में मेटा-जानकारी या शीर्षक शामिल होती है. जैसे वेब पेज शीर्षक, उपयोग होने वाली सीएसएस स्क्रिप्ट, सीएसएस स्टाइलशीट, आदि।
- <title> – यह टैग सक्रिय एचटीएमएल दस्तावेज़ का शीर्षक निर्दिष्ट करता है. यह ब्राउज़र के शीर्षक बार या वेब ब्राउज़र टैब में टाइटल के रूप में प्रदर्शित होता है।
- <body> – सभी एचटीएमएल टेक्स्ट जानकारी या किसी ऑब्जेक्ट में बॉडी टैग के साथ वेब पेज की दृश्य सामग्री के रूप में शामिल होती है।
- <heading tag> – <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, आप अपने मौजूदा वेब पेज में विभिन्न स्तरों (सबसे बड़े हैडिंग से लेकर सबसे छोटे हैडिंग महत्व तक) के शीर्षकों का एचटीएमएल वेब पेज में उपयोग कर सकते हैं।
- <p> – पैराग्राफ टैग का उपयोग एचटीएमएल वेब पेज में नए टेक्स्ट के नए पैराग्राफ को परिभाषित करने के लिए किया जाता है।
- <a> – मौजूदा वेब पेज में हाइपरलिंक बनाने के लिए उपयोग किया जाने वाला एक टैग है। यह टैग आपको आपको सक्रिय टेक्स्ट को अन्य वेब पेजों या वेब संसाधनों से डायरेक्ट लिंक करने की अनुमति देता है।
- <img> – इस टैग का उपयोग सक्रिय वेब पेज में विभिन्न प्रकार की ग्राफ़िक्स, वॉलपेपर, छवि डालने के लिए किया जाता है।
- <div> – यह टैग अन्य एचटीएमएल वेब पेज तत्वों को समूहित और स्टाइल करने के लिए एक कंटेनर के रूप में उपयोग किया जाता है।
- <big> – यह टैग सक्रिय एचटीएमएल टेक्स्ट का आकार बढ़ाता देता है।
- <br> – इस टैग का उपयोग किसी टेक्स्ट में नया ब्रेक डालने या टेक्स्ट को नई लाइन में ले जाने के लिए किया जाता है।
- <span> – स्पेन टैग इनलाइन कंटेनर का उपयोग कुछ एचटीएमएल वेब पेज शैलियों को लागू करने या एचटीएमएल वेबपेज टेक्स्ट के कुछ विशिष्ट भागों में हेरफेर करने के लिए किया जाता है।
- <ul> – इस टैग का उपयोग किसी भी एचटीएमएल वेब पेज टेक्स्ट के सामने एक अव्यवस्थित (बुलेट वाली) लिस्ट को दर्शाने के लिए किया जाता है।
- <ol> – यह टैग किसी एचटीएमएल वेब पेज टेक्स्ट या लिस्ट के सामने क्रमबद्ध (क्रमांकित) लिस्ट या संख्याओं का प्रतिनिधित्व करने के लिए उपयोग किया जाता है।
- <li> – इस टैग का उपयोग <ul> या <ol> टैग तत्व के भीतर एक नई लिस्ट आइटम को परिभाषित करने के लिए किया जाता है।
- <table> – तालिका टैग का उपयोग पंक्ति और स्तंभ क्रम में सारणीबद्ध डेटा और डिजिटल इनफार्मेशन के लिए एक तालिका बनाने के लिए किया जाता है।
- <tr> – tg टैग का उपयोग एचटीएमएल तालिका संरचना में एक नई खाली टेबल पंक्ति को परिभाषित करने के लिए किया जाता है।
- <td> – td टैग एक सक्रिय एचटीएमएल वेब पेज में तालिका पंक्ति के भीतर एक खाली सेल का प्रतिनिधित्व करता है।
- <form> – फॉर्म टैग में फॉर्म तत्व शामिल होते हैं. जैसे एकाधिक फॉर्म इनपुट फ़ील्ड, बटन, चेकबॉक्स, इत्यादि एचटीएमएल फॉर्म कण्ट्रोल होते है।
- <input> – इनपुट टैग किसी भी नए डिज़ाइन वाले एचटीएमएल फॉर्म में एचटीएमएल उपयोगकर्ता इनपुट ऑब्जेक्ट, जैसे टेक्स्ट इनपुट, चेकबॉक्स, रेडियो बटन, इत्यादि एचटीएमएल फॉर्म इनपुट ऑब्जेक्ट बनाने की अनुमति देता है।
- <button> – बटन एचटीएमएल टैग का उपयोग कुछ दृश्यमान या क्लिक करने योग्य एचटीएमएल वेब पेज बटन को प्रदर्शित करने या बनाने के लिए किया जाता है।
- <textarea> – यह टैग हमें एचटीएमएल फॉर्म डिज़ाइनिंग के दौरान एक मल्टी-लाइन टेक्स्ट इनपुट क्षेत्र बनाने और टेक्स्ट इनफार्मेशन को स्टोर करने की अनुमति देता है।
ये कुछ प्रमुख एचटीएमएल प्रयुक्त टैग उदाहरण हैं। इसके अलावा कई अन्य एचटीएमएल में कुछ अन्य लोकप्रिय टैग हैं। हम इन्हें अपनी आवश्यकता के अनुसार उपयोग कर सकते हैं।
Img tag html
एचटीएमएल में <img> टैग का उपयोग एक सक्रिय एचटीएमएल वेब पेज में एक छवि, ग्राफ़िक, वॉलपेपर, डालने के लिए किया जाता है।
निचे एचटीएमएलl <img> टैग का मूल सिंटैक्स है।
एचटीएमएल कोड
<img src=’image-url’ alt=’वैकल्पिक-पाठ’>
यहाँ आपको <img> टैग में दो आवश्यक विशेषताएँ देनी होती हैं।
- Src – एचटीएमएल वेब पेज में प्रयुक्त छवि का स्रोत (यूआरएल या फ़ाइल पथ) या यूज़ होने वाली इमेज का स्टोरेज लोकेशन निर्दिष्ट करता है।
- alt – यह उपयोग होने वाली इमेज को वैकल्पिक टेक्स्ट प्रदान करता है. जो तब प्रदर्शित या दिखता होता है, जब छवि क्लाइंट वेब ब्राउज़र में लोड नहीं की जा सकती या वेब ब्राउज़र में एक्सेसिबिलिटी उद्देश्यों के लिए होती है।
Html img tag
The below html code displays linked website logo image and display it in your active web browser.
<!DOCTYPE html>
<html>
<head>
<title>Simple Image Tag Example</title>
</head>
<body>
<h2>Image Example</h2>
<img src=”https://vcanhelpsu.com/logo.jpg” alt=”This is th logo image”>
</body>
</html>
New line html
एचटीएमएल वेब पेज में, आप <br> टैग के उपयोग से एक नई लाइन या लाइन ब्रेक बना सकते हैं। br टैग का उपयोग एक के ऊपर एक टेक्स्ट लिस्ट आर्डर में प्रदर्शित करने में किया जाता है. हर बार br टैग के इस्तेमाल के बाद यह एचटीएमएल टेक्स्ट को नेक्स्ट लाइन पर भेज देता है.
नीचे उदाहरण है.
Html code
<!DOCTYPE html>
<html>
<head>
<title>Br Tag with New Line Example</title>
</head>
<body>
<h2>Use Br Tag Form New Line</h2>
<p>Python. <br>
Html. <br>
Css<br>
JavaScript<br></p>
</body>
</html>
ऊपर दिए गए उदाहरण में, <br> टैग का उपयोग <p> टैग के भीतर दो वाक्यों के बीच एक नई लाइन बनाने के लिए किया जाता है। जब ये एचटीएमएल वेब पेज प्रस्तुत किया जाएगा, तो यह सभी टेक्स्ट लाइन्स को वन बाय वन प्रदर्शित होगा।
Html validator
एचटीएमएल सत्यापनकर्ता एक एचटीएमएल स्क्रिप्ट कोड एरर चेक उपकरण है. जो आपके द्वारा लिखे गए एचटीएमएल कोड के सिंटैक्स और संरचना की जांच करता है, ताकि यह सुनिश्चित हो सके कि यह एचटीएमएल विनिर्देश द्वारा परिभाषित नियमों और मानकों का सही से पालन करता है या नहीं। यह टूल वेब डेवलपर को किसी भी एचटीएमएल मार्कअप में किसी भी त्रुटि या समस्या को पहचानने और रिपोर्ट करने में मदद करता है।
Html color
आप अपने एचटीएमएल वेब पेज में, रंगों को विभिन्न विधियों या प्रकारों का उपयोग करके निर्दिष्ट या अप्लाई किया जा सकता है।
यहाँ आपको एचटीएमएल दस्तावेज़ में रंगों को परिभाषित करने के कुछ सामान्य तरीके या मेथड नीचे दिए गए हैं।
एचटीएमएल टैग्स आपको पूर्वनिर्धारित रंग नामों का एक सेट प्रदान करता है. जिसका आप अपने किसी भी डिज़ाइन वेब पेज में सीधे उपयोग कर सकते हैं। आप अपने वेब पेज में एचटीएमएल कलर को साधारण कलर नाम से, हेक्साडेसीमल कोड से, rgb कोड से, hsl कलर कोड से सीधे प्रयोग कर सकते है.
Html color code
- <p style=”color: lime;”>Lime color text Preview. </p>
- <p style=”color: brown;”>Brown color text preview. </p>
Hexadecimal Color code.
- Html hexadecimal color code
<p style=”color: #F5350C;”>this is the first hexadecimal color preview. </p>
<p style=”color: ##0E3A3D;”>this is the second hexadecimal color preview. </p>
RGB color code.
- Html Rgb color code
<p style=”color: rgb (255, 140, 12);”>this is the first rgb color preview. </p>
<p style=”color: rgb (255, 160, 199);”>this is the second rgb color preview. </p>
HSL Color.
- Html hsl color code
<p style=”color: hsl (240, 100%, 50%);”>this is the first Hsl color preview. </p>
<p style=”color: hsl (200, 100%, 50%);”>this is the second Hsl color preview. </p>
New line in html
नीचे दिया गया एचटीएमएल कोड एक से पांच तक एक टेक्स्ट को एक-एक करके br टैग के साथ प्रदर्शित करता है। इस उदहारण में आप स्पष्ट रूप से br टैग का उपयोग देख सकते है.
Br tag Syntax – <p>One<br>Thwo<br>Three<br>Four<br>Five<br></p>
Html newline
Br tag example.
Syntax – <p>Windows<br>Mac Os<br>Linux<br>Android<br>Google Chrome Os<br></p>
Html line break
एचटीएमएल लाइन ब्रेक उदाहरण.
Html code
<p>First line break<br>Second line break<br>Third line break<br>Four-line break<br>Fifth line break<br></p>
What is span in html
एचटीएमएल वेब पेज में <span> टैग एक इनलाइन तत्व है. जिसका उपयोग कुछ प्री-डिफाइंड एचटीएमएल स्टाइल्स को लागू करने या टेक्स्ट या इनलाइन सामग्री के विशिष्ट भागों को लक्षित करके प्रदर्शित किया जाता है। इसका अपने आप में कोई अंतर्निहित अर्थ या एचटीएमएल टेक्स्ट दृश्य प्रभाव नहीं है, लेकिन स्टाइल या कार्यक्षमता जोड़ने के लिए सीएसएस स्टाइलशीट या जावास्क्रिप्ट के साथ संयोजन में इसका उपयोग किया जा सकता है।
निचे आपको <span> टैग का मूल सिंटैक्स है।
Html span code example
आप टेक्स्ट के विशिष्ट भागों को सामग्री के एक बड़े ब्लॉक में रैप के लिए <span> टैग का उपयोग कर सकते हैं।
Html span code
<p align=center>Welcome to <span style=”color: orange;”>Vcanhelps.com</span> <br><span style=”color: teal;”>Best place for coding</span></p>
Image tag html
मौजूदा वेब पेज में एचटीएमएल में एक छवि प्रदर्शित करने के लिए, आप <img> टैग का उपयोग कर सकते हैं।
This is the example of how to use it.
<img src=”imagename.png” alt=”info about used image”>
<img src=”imagename.png” alt=”info about used image” width=”300″ height=”180″ title=”Add image title info”>
Newline html
एचटीएमएल वेब पेज में पैराग्राफ टैग का उपयोग एक या एक से अधिक कई अलग-अलग पंक्तियों को प्रदर्शित करने के लिए किया जाता है
- <p>Simple Paragraph tag</p>
- <p>Simple Paragraph tag</p>
निचे आप एक एचटीएमएल उपरोक्त टेक्स्ट को नई लाइन प्रभाव के साथ प्रदर्शित करने के लिए समान उपरोक्त br टैग का उपयोग एकल पैराग्राफ में चार बार प्रदर्शित किया गया है।
<p>Info 1<br>Info 2<br>Info 3<br>Info 4<br></p>
Span in html, span html
एचटीएमएल में स्पैन टैग का उपयोग कुछ आकर्षक टेक्स्ट स्टाइल या css प्रभाव को लागू करने के लिए किया जाता है. आमतौर पर स्पैन टैग का उपयोग एचटीएमएल में संभवत, सीएसएस के साथ किया जाता है।
Span Tag Syntax.
<p>This is basic example of <span style=”color: brown;”>tag</span><br> this is another span text<span style=”color: yellow”>example</span> text. </p>
Img html tag
निचे आपको एक सिंपल एचटीएमएल वेब पेज में एकाधिक img टैग उपयोग और विशेषताएँ दी गई है।
- <img src=”windows11.jpg” alt=”this is the windows11 image”>
- <img src=”macos.png” alt=”apple mac os image” width=”300″ height=”220″ title=”macimage”>
What does html stand for
एचटीएमएल का अर्थ हाइपरटेक्स्ट मार्कअप लैंग्वेज है। एचटीएमएल वेबसाइट वेब पेजों की सामग्री को बनाने और उन्हें वेब ब्राउज़र में संरचित करने के लिए उपयोग की जाने वाली मानक मार्कअप भाषा है। एचटीएमएल किसी भी वेब दस्तावेज़ के भीतर तत्वों को चिह्नित करने, उनकी संरचना और अर्थ संबंधी अर्थ को परिभाषित करने के लिए टैग का उपयोग करता है। क्लाइंट वेब ब्राउज़र एचटीएमएल में लिखे गए कोड की व्याख्या करते हैं, और इसे उपयोगकर्ताओं के देखने और कम्यूनिकेट करने के लिए विज़ुअल वेब पेज के रूप में प्रस्तुत करते हैं। एचटीएमएल डेवलपमेंट टैग्स वर्ल्ड वाइड वेब का एक अनिवार्य घटक है, और वेब विकास की नींव बनाता है।
Img tag in html
Html Multiple img tag attributes.
- <img src=”windows10.jpg” alt=”this is the windows10 image”>
- <img src=”iphone.png” alt=”apple iphone image” width=”300″ height=”220″ title=” iphoneimage”>
What is href in html
एचटीएमएल वेब पेज में, हाइपरलिंक संदर्भ निर्दिष्ट करने के लिए विभिन्न एचटीएमएल तत्वों में href लिंक विशेषता का उपयोग किया जाता है। इस एचटीएमएल टैग का उपयोग आमतौर पर किसी भी एचटीएमएल वेब पेज में हाइपरलिंक के गंतव्य URL को परिभाषित करने के लिए <a> (एंकर) तत्व में किया जाता है।
Below you have html ahref link example.
Html ahref code
<p></p><a href=”https://vcanhelpsu.com/”>Explore Vcanhelpsu.com website</a><br>
<a href=”https://vcanhelpsu.com/about-html/”>About Html Page</a></p>
A href html tag, Html href tag, Html aref tag, Ahrefs html tag, Html ahref tag, Html a href tag example.
The <a> tag in HTML is used to create a hyperlink, or a link to another webpage or resource.
- Simple Website link
<a href=”https://www.google.com”>Click to open google</a>
- Any web site web page link
<a href=”https://vcanhelpsu.com/contact-us/”>Contact Us</a>
- Link with target blank new tab attributes.
<a href=”https://vcanhelpsu.com” target=”_blank”>Open Link in new tab</a>
- Ahref Link with ol tag.
<ol>
<li><a href=”https://vcanhelpsu.com”>Home page</a></li>
<li><a href=”https://vcanhelpsu.com/contact-us/”>Contact page</a></li>
<li><a href=”https://vcanhelpsu.com/abouts-us/”>About page</a></li>
</ol>
Html form
एचटीएमएल फॉर्म एक वेबपेज का एक भाग है. जो वेब उपयोगकर्ताओं को डेटा इनपुट करने और फॉर्म इनफार्मेशन को प्रसंस्करण के लिए सर्वर पर सबमिट करने की अनुमति देता है। एक सामान्य एचटीएमएल फॉर्म में टेक्स बोक्स, लेबल, चेक बॉक्स, रेडियो बटन, टेक्स्ट एरिया, फ्रेम, डेट, बटन आदि का कॉम्बिनेशन होता है.
Below is the example of how to create an HTML form.
<!DOCTYPE html>
<html>
<head>
<title>Br Tag with New Line Example</title>
</head>
<body>
<form>
<label for=”name”>First Name </label>
<input type=”text”>
<br>
<label for=”name”>Last Name </label>
<input type=”text”>
<br>
<label for=”email”>Email </label>
<input type=”email” id=”email” name=”email”>
<br>
<label for=”information”>Information</label>
<textarea id=”information” name=”information”></textarea>
<br>
<input type=”submit”>
</form>
</body>
</html>
Input types html, html input
एक सामान्य एचटीएमएल फॉर्म आपको कई इनपुट फॉर्म विकल्प प्रकार प्रदान करता है. जो वेब उपयोगकर्ताओं को विभिन्न प्रकार के फॉर्म डेटा और इनफार्मेशन को इनपुट करने की अनुमति देता है।
Below are some commonly used input types in HTML form.
- Text Input <type=”text”>.
<label for=”name”>First Name </label>
<input type=”text”>
- Password Input <type=”password”>.
<label for=”password”>Password</label>
<input type=”password”>
- Email Input <type=”email”>.
<label for=”email”>Enter Email </label>
<input type=”email” id=”email” name=”email”>
- Number Input <type=”number”>.
<label for=”number”>Number</label>
<input type=”number”>
- Date Input <type=”date”>.
<label for=”date”>Date</label>
<input type=”date”>
- Html checkbox, checkbox Input <type=”checkbox”>.
<p>Course</p>
<label for=”html”>Html</label>
<input type=”checkbox”>
<label for=”css”>Css</label>
<input type=”checkbox”>
- Radio Input <type=”radio”>.
<p>Gender</p>
<label for=”male”>Male</label>
<input type=”radio”>
<label for=”female”>Female</label>
<input type=”radio”>
- File Input <type=”file”>.
<label for=”fileUpload”>file upload </label>
<input type=”file” id=”fileUpload” name=”fileUpload”>
<input type=”submit” value=”Upload”>
- Submit Button <type=”submit”>.
<label for=”submit”>Submit </label>
<input type=”submit” value=”Submit”>
- Reset Button <type=”reset”>.
<label for=”reset”>Reset </label>
<input type=”reset” value=”Reset”>
- Button <type=”button”>.
<button type=”button”>Ok</button>
Line break html, Html new line
- Simple Line break with br tag.
<p>1<br>2<br>3<br>4<br></p>
- Line break with css style block
<p>Line Break with Css style</p>
<p style=”display: block;”>One</p>
<p style=”display: block;”>Two</p>
<p style=”display: block;”>Three</p>
Header html, Html headers
एचटीएमएल में “हेडर” किसी भी वेबपेज के शीर्ष भाग सबसे ऊपर वाले भाग जहा वेबसाइट के नेविगेशन मेनू लिंक्स या वेबपेज के भीतर एक अनुभाग को संदर्भित करता है. जिसमें आम तौर पर वेबसाइट परिचयात्मक या नेविगेशनल सामग्री या कम्पलीट वेबसाइट मेनू होता है। एचटीएमएल में वेबसाइट हेडर तत्व को वेबसाइट <हेडर> टैग द्वारा दर्शाया या परिभाषित किया जाता है।
एचटीएमएल में <हेडर> टैग एक सिमेंटिक एचटीएमएल तत्व है. जिसका उपयोग किसी एचटीएमएल दस्तावेज़ के हेडर अनुभाग को परिभाषित करने के लिए किया जाता है। वेबसाइट के किसी भी पोस्ट, ब्लॉग, लिंक, आर्टिकल इन्फो, सामग्री के बारे में जानकारी प्रदान करने या नेविगेशन लिंक, लोगो या अन्य तत्वों को शामिल करने के लिए इसे अक्सर दस्तावेज़ के शीर्ष पर या एक विशिष्ट अनुभाग के भीतर रखा जाता है।
You can see example of how you can use the <header> tag in HTML.
<!DOCTYPE html>
<html>
<head>
<title>Example Page</title>
</head>
<body>
<header>
<h2>Header Tag with Empty Website Menu</h2>
<nav>
<ul>
<li><a href=”#”>Home</a></li>
<li><a href=”#”>About Us</a></li>
<li><a href=”#”>Contact Us</a></li>
<li><a href=”#”>Disclaimers</a></li>
<li><a href=”#”>Social Links</a></li>
</ul>
</nav>
</header>
</body>
</html>
</body>
</html>
Html input type
Popular html input type.
- Text Input – <input type=”text”>
- Password Input – <input type=”password”>
- Email Input – <input type=”email”>
- Number Input – <input type=”number”>
- Checkbox – <input type=”checkbox”>
- Radio Button – <input type=”radio”>
- File Input – <input type=”file”>
- Date Input – <input type=”date”>
Html head
एचटीएमएल वेब पेज में, <head> तत्व दस्तावेज़ के भीतर मेटाडेटा और अन्य गैर-दृश्यमान एचटीएमएल तत्वों के लिए कंटेनर का प्रतिनिधित्व करता है। इसे एचटीएमएल दस्तावेज़ के शुरुआती <html> टैग और शुरुआती <body> टैग के बीच लिखा जाता है।
<head> अनुभाग में आम तौर पर दस्तावेज़ के बारे में हैडिंग जानकारी शामिल होती है. जैसे एचटीएमएल दस्तावेज़ का शीर्षक, बाहरी css स्टाइलशीट या css स्क्रिप्ट के लिंक, वर्ण एन्कोडिंग घोषणाएं और अन्य वेब पेज मेटाडेटा, इनफार्मेशन स्टोर होती है। head टैग एचटीएमएल वेबपेज पर प्रदर्शित होने वाली दृश्य सामग्री शामिल नहीं है।
Html center image, Center image html, how to center image in html
एचटीएमएल वेब पेज में img टैग की विशेषताओं का उपयोग करके किसी छवि, वॉलपेपर, बैकग्राउंड इमेज, को उसके मूल कंटेनर में केन्द्रित करने के लिए, आप <img> टैग पर “केंद्र” के मान के साथ संरेखित विशेषता का उपयोग कर सकते हैं।
Below is the example.
- <pre style=”text-align: center;”>
- <img src=”imagename.png” alt=”Image info” align=”center”>
- </pre>
Html beautify, Beutify html
आपके मौजूदा डिज़ाइन एचटीएमएल वेब पेज कोड को सुंदर बनाने के लिए, आप अंतर्निहित फ़ॉर्मेटिंग सुविधाओं के साथ विभिन्न ऑनलाइन टूल या टेक्स्ट संपादकों का उपयोग कर सकते हैं।
यहाँ निचे आपको कुछ लोकप्रिय एचटीएमएल ब्यूटीफाई कोड/टूल दिए गए है।
- HTML Beautifier
- HTML Formatter
- HTML Tidy
Iframe html, Html iframe, Iframe with html, Html for iframe, Html to iframe
एचटीएमएल iframe (इनलाइन फ़्रेम का संक्षिप्त रूप) एक एचटीएमएल टैग तत्व है. जिसका उपयोग वर्तमान एचटीएमएल वेब पेज को अलग अलग फ्रेम में डिवाइड करने और एचटीएमएल दस्तावेज़ के भीतर किसी अन्य एचटीएमएल दस्तावेज़ या लिंक को एम्बेड करने के लिए किया जाता है। यह आपको अपने एचटीएमएल पेज के भीतर किसी अन्य वेब स्रोत, जैसे वेबपेज या वीडियो, टेक्स्ट, ऑडियो, वेबसाइट से सामग्री प्रदर्शित करने की अनुमति देता है।
एचटीएमएल में <iframe> टैग का उपयोग कैसे करें इसका उदाहरण नीचे दिया गया है।
Html iframe code
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<h1>Html Iframe Example</h1>
<iframe src=”https://vcanhelpsu.com” width=”600″ height=”400″></iframe>
</body>
</html>
Html i frame, Html ifram, I frame html, Iframe to html
Let’s explore some html iframe example.
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<h1>Html Iframe Example</h1>
<iframe src=”https://wikipedia.com” width=”500″ height=”400″></iframe>
</body>
</html>
ऊपर दिए गए उपरोक्त उदाहरण में, हमारे पास एक एचटीएमएल <iframe> तत्व है. जो डिफ़ॉल्ट इस फ्रेम में https://www.wikipedia.com वेबसाइट की सामग्री को प्रदर्शित करता है। Src विशेषता एम्बेड किए जाने वाले वेब पेज पृष्ठ का URL निर्दिष्ट करती है। iframe में चौड़ाई और ऊंचाई विशेषताएँ सक्रिय iframe के आयामों को पिक्सेल में सेट करती हैं।
यहाँ आप अपनी आवश्यकताओं के अनुसार iframe स्रोत, चौड़ाई और ऊंचाई विशेषताओं को अनुकूलित कर सकते हैं।
Html bold
एचटीएमएल वेब पेज में किसी भी सामान्य पैराग्राफ टेक्स्ट को बोल्ड बनाने के लिए आप <strong> या <b> टैग का उपयोग कर सकते हैं। दोनों टैग का उपयोग सामान्य पैराग्राफ टेक्स्ट को बोल्ड दिखाने के लिए किया जाता है।
Below is the example.
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<h1>Html Bold Tag Example</h1>
<p>Welcome To <strong>Vcanhelpsu.com website</strong></p>
<p>Best for <b>Computer Programming Coding</b> Vcanhelpsu.com</p>
<p>This Is No Bold Text<br><b> This Is Bold Text<br></b></p>
</body>
</html>
ऊपर दिए गए उपरोक्त उदाहरण में, हमारे पास दो पैराग्राफ हैं. जिनमें अलग-अलग पैराग्राफ टेक्स्ट हैं। टेक्स्ट “Vcanhelpsu.com वेबसाइट” पहले पैराग्राफ में <strong> टैग के भीतर और दूसरे पैराग्राफ में <b> टैग के भीतर संलग्न प्रदर्शित है। दोनों वेब पेज टेक्स्ट को बोल्ड फ़ॉन्ट शैली में प्रस्तुत करते हैं।
How to add image in html, add image html, how to add image html, Add image in html
आइए जानें कि सक्रिय एचटीएमएल वेबपेज या वेबसाइट में एक साधारण छवि कैसे जोड़ें। या किसी भी प्रकार के इमेज, वॉलपेपर, ग्राफ़िक, को कैसे एक एचटीएमएल में प्रदर्शित करे.
Html image add code
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<h1>Html Bold Img Tag Example</h1>
<img src=”map.png” alt=”this image represent map of india”>
</body>
</html>
Adding an image in html, how to add images in html, how to add image to html
आइए जानें कि सक्रिय एचटीएमएल वेब पेज में किसी भी प्रकार की छवि को कैसे जोड़ें। या किसी भी प्रकार के इमेज, वॉलपेपर, ग्राफ़िक, को कैसे एक एचटीएमएल में कैसे प्रदर्शित करे.
Html img tag code
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<h1>Html Bold Img Tag Example</h1>
<img src=”countymap.jpg” alt=”represent different country” width=”250″ height=”220″ title=”country map”>
</body>
</html>
ऊपर प्रदर्शित उपरोक्त उदाहरण में, एचटीएमएल वेब पेज में इमेज चौड़ाई और ऊंचाई विशेषताएँ पिक्सेल में सक्रिय छवि के आयामों को परिभाषित करती हैं, और इमेज शीर्षक विशेषता एक इमेज के टूलटिप टेक्स्ट निर्दिष्ट करती है. जो एचटीएमएल उपयोगकर्ता द्वारा छवि पर होवर करने पर प्रदर्शित होता है। आप इन इमेज एचटीएमएल विशेषताओं को अपनी विशिष्ट छवि आवश्यकता के अनुसार समायोजित कर सकते हैं।
Html beautifier
यदि आप अपने मौजूदा एचटीएमएल कोड को सुंदर बनाने या प्रारूपित करने के लिए किसी टूल की तलाश कर रहे हैं. तो आपको कई ऑनलाइन एचटीएमएल ब्यूटीफायर टूल उपलब्ध मिलते हैं। ये उपकरण आपके सामान्य एचटीएमएल वेब पेज कोड को अधिक पठनीय और संरचित तरीके से व्यवस्थित और प्रारूपित करने में आपकी सहायता करते हैं।
Some of the popular html beautifier online websites
- HTML Beautifier – https://htmlbeautifier.com/
- Free Formatter HTML Formatter – https://www.freeformatter.com/html-formatter.html
- HTML Tidy – https://infohound.net/tidy/
ये एचटीएमएल उपकरण आपके एचटीएमएल कोड को साफ करने और व्यवस्थित करने में सहायक हो सकते हैं. जिससे किसी भी सामान्य और जटिल एचटीएमएल कोड को अधिक पठनीय और बनाए रखना आसान हो जाता है। बस आप अपना एचटीएमएल कोड टूल में पेस्ट करें, एचटीएमएल कोड के लिए वांछित फ़ॉर्मेटिंग विकल्प चुनें (यदि उपलब्ध हो), और ये टूल आपके लिए सुंदर एचटीएमएल संस्करण तैयार करेगा।
Html template
Let’s explore basic html template structure.
<!DOCTYPE html>
<html>
<head>
<meta charset=”UTF-8″>
<title>Webpage Title</title>
<link rel=”stylesheet” href=”styles.css”>
</head>
<body bgcolor=”grey”>
<header>
<h1 align=center>Web Page Heading</h1>
<nav>
<ul>
<li><a href=”#”>Home</a></li>
<li><a href=”#”>Blog</a></li>
<li><a href=”#”>About Us</a></li>
<li><a href=”#”>Contact Us</a></li>
<li><a href=”#”>Disclaimers</a></li>
</ul>
</nav>
</header>
<main>
<div>
<h2>First web page sections</h2>
<p>You can add desire elements in this div section</p>
</div>
<section>
<h2>Second web page Section</h2>
<p>Similar above you can add desire content here</p>
</section>
</main>
<footer>
<p align=center><b></b>Copyright 2021 – 2023 by vcanhelpsu.com, </b></p>
</footer>
</body>
</html>
Italics html, Italic html, Italics in html, Html italic
यदि आप एचटीएमएल वेबपेज में अपने किसी टेक्स्ट को इटैलिक बनाना चाहते हैं. तो आप <em> या <i> एचटीएमएल टैग का उपयोग कर सकते हैं। दोनों टैग का उपयोग वर्तमान वेबपेज में इटैलिक फॉर्मेट में टेक्स्ट को जोर देने और टेक्स्ट को इटैलिकाइज़्ड फॉर्मेट में दिखाने के लिए किया जाता है।
Below is the example.
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>Italic effect with<br><em>Em tag convert written text in italic manner</em></p>
<p>Html I Tag <br><i>Make simple text in italic text order</i></p>
</body>
</html>
ऊपर उपयोग किये गए ईएम या आई टैग दोनों टैग का उपयोग टेक्स्ट को इटैलिक फॉर्मेट में प्रदर्शित करने के लिए कर सकते है। जिसका उपयोग आप किसी भी एचटीएमएल टेक्स्ट को इटैलिक क्रम में परिवर्तित करने के लिए कर सकते हैं।
What are html tags, html a tags
एचटीएमएल टैग किसी भी एचटीएमएल वेब पेज दस्तावेज़ों के निर्माण खंड हैं। इनका उपयोग आप किसी वेबपेज के भीतर सामग्री को संरचना और प्रारूपित करने के लिए किया जाता है। एचटीएमएल टैग एंगुलर कोष्ठक (<>) के भीतर संलग्न होते हैं, और इसमें एक प्रारंभिक टैग और एक एचटीएमएल समापन टैग होता है।
Below some of the commonly used HTML tags.
Ex –
<html>, <head><title>, <body>, <title>, <h1>, <p>, <table>, <b>, <i>, <u>, <form>, <ol>, <ul>, <ahref>, <iframe>, and so many other popular.
Font html
फॉण्ट टैग एचटीएमएल में फ़ॉन्ट शैलियों, फॉण्ट आकारों और फॉण्ट रंगों को निर्दिष्ट करने के लिए एचटीएमएल 4 के पुराने संस्करणों में <font> टैग का उपयोग किया गया था। हालाँकि, वर्त्तमान में आधुनिक एचटीएमएल 5 वर्शन में <font> टैग का उपयोग करने की अनुशंसा नहीं की जाती है। इसकी जगह आप css स्क्रिप्ट का उपयोग कर सकते है.
Below is the font tag example.
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<p>
<font size=”6″ color=”teal”>Font size with font color effect</font>
</p>
<p>
<font size=”5″ color=”brown”>Font size 5 and color is brown</font>
</p>
<p>
<font face=”monotype corsiva” size=”7″ color=”red”>Font face is monotype corsiva size 7 and color is red</font>
</body>
</html>
Html anker tag
एचटीएमएल में एंकर टैग को <a> टैग द्वारा दर्शाया जाता है। इसका उपयोग मुख्य रूप से समान वेब पेज में हाइपरलिंक लिंक बनाने के लिए किया जाता है. जो एचटीएमएल उपयोगकर्ताओं को एक ही पेज के भीतर विभिन्न वेब पेजों या अनुभागों पर नेविगेट या लिंक करने की अनुमति देता है।
Below is the example.
<!DOCTYPE html>
<html>
<head>
<title>Html Anchor Tag Example</title>
</head>
<body>
<h1>How to use anchor tag in html</h1>
<p>You can Search <a href=”https://vcanhelpsu.com”>For HTML, CSS, JavaScript</a> this website</p>
<p>Move on <a href=”#text1″>text1</a> move in the same page text1. </p>
<h2 id=”text1″>text1</h2>
<p>Here is the text1 information in active web page</p>
</body>
</html>
Radio buttons html, Html radio buttons
एचटीएमएल में रेडियो बटन का उपयोग किसी भी एचटीएमएल वेब पेज में कई विकल्पों की एक लिस्ट प्रस्तुत करने के लिए किया जाता है. जहां आप रेडियो बटन में एक समय में केवल एक ही विकल्प चुना जा सकता है। एचटीएमएल वेब पेज में प्रत्येक रेडियो बटन को “रेडियो” पर सेट प्रकार विशेषता के साथ फॉर्म <इनपुट> टैग द्वारा दर्शाया जाता है।
Below is the example.
<!DOCTYPE html>
<html>
<head>
<title>Html Radio Tag Example</title>
</head>
<body>
<h1>How to use Radio Buttons</h1>
<form>
<p>Select Programming Courses</p>
<input type=”radio” id=”python” name=”python” value=”python”>
<label for=”option1″>Python</label><br>
<input type=”radio” id=”java” name=”java” value=”java”>
<label for=”option2″>Java</label><br>
<input type=”radio” id=”html” name=”html” value=”html”>
<label for=”option3″>Html</label><br>
</form>
<form>
<p>Gender</p>
<input type=”radio” id=”male” name=”male” value=”male”>
<label for=”option3″>Male</label><br>
<input type=”radio” id=”female” name=”female” value=”female”>
<label for=”option3″>Female</label><br>
</form>
</body>
</html>
Html button radio, Radio button for html
आइए कुछ बुनियादी एचटीएमएल वेब पेज में रेडियो बटन उपयोग के उदाहरण देखें।
<form>
<p>Select Course Language</p>
<input type=”radio” id=”english” name=”english” value=”english”>
<label for=”option3″>English</label><br>
<input type=”radio” id=”hindi” name=”hindi” value=”hindi”>
<label for=”option3″>Hindi</label><br>
<input type=”radio” id=”regional” name=”regional” value=”regional”>
<label for=”option3″>Regional</label><br>
</form>
Html lists
एचटीएमएल आपके वेब पेज के लिए कई प्रकार की लिस्ट्स प्रदान करता है. जिनका उपयोग आप अपने किसी भी वेबपेज पर सामग्री को नंबर्स आर्डर या बुलेटेड आर्डर में लिस्ट संरचना और व्यवस्थित करने के लिए कर सकते हैं। एचटीएमएल में लिस्ट्स तीन मुख्य प्रकार की होती हैं।
Type of html list.
- Ordered Lists <ol>.
- Unordered Lists <ul>.
- Definition Lists <dl>.
Html List Example.
<!DOCTYPE html>
<html>
<head>
<title>Different type of list Tag Example</title>
</head>
<body>
<p><b>Ordered List Example</b></p>
<ol>
<li>Windows</li>
<li>Linux</li>
<li>Mac Os</li>
<li>Android Os</li>
<li>Chrome Os</li>
</ol>
<p><b>Unordered List Example</b></p>
<ul>
<li>Sql</li>
<li>MySQL</li>
<li>Pl/sql</li>
<li>PostgreSQL</li>
</ul>
<p><b>Definition List Example</b></p>
<dl>
<dt>Python</dt>
<dd>Python is modern multipurpose programming</dd>
<dt>Java</dt>
<dd>Java is modern object-oriented programming language</dd>
<dt>W3.css</dt>
<dd>W3.css is readymade css frameworks to embedded code in any html document</dd>
</dl>
</body>
</html>
Html doctype
किसी भी वर्त्तमान एचटीएमएल वेब पेज में, DOCTYPE घोषणा का उपयोग वर्त्तमान एचटीएमएल के उस संस्करण को निर्दिष्ट करने के लिए किया जाता है. जिसे आप अपने वेबपेज डिज़ाइन के लिए उपयोग कर रहे हैं। यह आपके वेब ब्राउज़र को दस्तावेज़ के प्रकार और पेज को रेंडर करते समय किन नियमों का पालन करना चाहिए, इसके बारे में सूचित करता है। DOCTYPE घोषणा को <html> टैग से पहले एचटीएमएल दस्तावेज़ की शुरुआत में रखा गया है। इसे डॉक्यूमेंट डिक्लेरेशन कहा जाता है. और यह एचटीएमएल 5 वर्शन को दर्शाता है.
सामान्य html5 doctype घोषणा नीचे है।
HTML5 संस्करण
एचटीएमएल सिंटैक्स
<!DOCTYPE html>
ऊपर दिए गए एक्साम्पल में उपरोक्त एचटीएमएल5 में DOCTYPE घोषणा सरल है, और आधुनिक एचटीएमएल5 वेब विकास के लिए पहले से अनुशंसित है। यह एचटीएमएल5 दस्तावेज़ प्रकार को सक्रिय करता है, और नवीनतम एचटीएमएल सुविधाओं और तत्वों के उपयोग को सक्षम बनाता है।