नोटपैड या टेक्स्ट का उपयोग करके HTML सीखें
पेशेवर HTML संपादकों का उपयोग करके वेब पेज बनाए और संशोधित किए जा सकते हैं।
हालांकि, HTML सीखने के लिए हम नोटपैड (PC) या TextEdit (Mac) जैसे एक साधारण पाठ संपादक की सिफारिश करते हैं।
हम मानते हैं कि एक साधारण पाठ संपादक का उपयोग करना HTML सीखने का एक अच्छा तरीका है।
Notepad या TextEdit के साथ अपना पहला वेब पेज बनाने के लिए नीचे दिए गए चरणों का पालन करें।
चरण 1: नोटपैड (पीसी) खोलें
विंडोज 8 या बाद के संस्करण:
प्रारंभ स्क्रीन खोलें (आपकी स्क्रीन पर नीचे बाईं ओर विंडो प्रतीक)। नोटपैड टाइप करें.
विंडोज 7 या उससे पहले:
Notepad > प्रोग्राम > सहायक उपकरण > प्रारंभ करें
चरण 1: TextEdit (Mac) खोलें
पाठ संपादन > अनुप्रयोग > खोजक खोलें
आवेदन प्राप्त करने के लिए कुछ प्राथमिकताओं को भी बदलें फ़ाइलों को ठीक से सहेजें. प्राथमिकताओं में > प्रारूप > "सादा पाठ" चुनें
फिर "खोलें और सहेजें" के तहत, उस बॉक्स को चेक करें जो कहता है "HTML फ़ाइलों को स्वरूपित पाठ के बजाय HTML कोड के रूप में प्रदर्शित करें"।
फिर कोड रखने के लिए एक नया दस्तावेज़ खोलें।
चरण 2: कुछ HTML लिखें
नोटपैड में निम्न HTML कोड लिखें या प्रतिलिपि बनाएँ:
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
चरण 3: HTML पृष्ठ सहेजें
फ़ाइल को अपने कंप्यूटर पर सहेजें. नोटपैड मेनू में फ़ाइल > सहेजें का चयन करें.
फ़ाइल को "इंडेक्स.htm" नाम दें और एन्कोडिंग को यूटीएफ -8 (जो एचटीएमएल फ़ाइलों के लिए पसंदीदा एन्कोडिंग है) पर सेट करें।
नोक: आप फ़ाइल एक्सटेंशन के रूप में .htm या .html का उपयोग कर सकते हैं। कोई अंतर नहीं है; यह आप पर निर्भर है।
चरण 4: अपने ब्राउज़र में HTML पृष्ठ देखें
अपने पसंदीदा ब्राउज़र में सहेजी गई HTML फ़ाइल खोलें (फ़ाइल पर डबल क्लिक करें, या राइट-क्लिक करें - और चुनें "ओपन विद")।
परिणाम इस तरह दिखेगा:
W3Schools ऑनलाइन संपादक - "इसे स्वयं आज़माएं"
हमारे मुफ्त ऑनलाइन संपादक के साथ, आप HTML कोड संपादित कर सकते हैं और अपने ब्राउज़र में परिणाम देख सकते हैं।
यह सही उपकरण है जब आप कोड का तेजी से परीक्षण करना चाहते हैं। इसका रंग भी है कोडिंग और दूसरों के साथ कोड को सहेजने और साझा करने की क्षमता:
उदाहरण
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>यह देखने के लिए "इसे स्वयं आज़माएं" बटन पर क्लिक करें कि यह कैसे काम करता है।
HTML मूल उदाहरण
इस अध्याय में हम कुछ बुनियादी HTML उदाहरण दिखाएंगे।
चिंता न करें यदि हम उन टैग का उपयोग करते हैं जिनके बारे में आपने अभी तक नहीं सीखा है।
HTML दस्तावेज़
सभी HTML दस्तावेज़ों को दस्तावेज़ प्रकार की घोषणा से शुरू होना चाहिए: |<!DOCTYPE html>
HTML दस्तावेज़ स्वयं के साथ शुरू होता है और समाप्त होता है।<html></html>
HTML दस्तावेज़ का दृश्यमान भाग और बीच में है। <body></body>
उदाहरण
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html><! DOCTYPE> घोषणा
घोषणा दस्तावेज़ प्रकार का प्रतिनिधित्व करती है, और ब्राउज़र को वेब पृष्ठों को सही ढंग से प्रदर्शित करने में मदद करती है।<!DOCTYPE>
यह पृष्ठ के शीर्ष पर (किसी भी HTML टैग से पहले) केवल एक बार दिखाई देना चाहिए।
घोषणा मामले संवेदनशील नहीं है।<!DOCTYPE>
HTML5 के लिए घोषणा है:<!DOCTYPE>
<!DOCTYPE html>HTML शीर्षक
HTML शीर्षकों को टैग के साथ परिभाषित किया गया है।<h1><h6>
<h1> सबसे महत्वपूर्ण शीर्षक को परिभाषित करता है। सबसे कम महत्वपूर्ण को परिभाषित करता है शीर्षक: <h6>
उदाहरण
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>HTML लिंक्स
HTML लिंक टैग के साथ परिभाषित किए गए हैं:<a>
HTML लिंक टैग के साथ परिभाषित किए गए हैं:<a>
उदाहरण
<a href="https://www.w3schools.com">This is a link</a>लिंक का गंतव्य विशेषता में निर्दिष्ट है. href
विशेषताओं का उपयोग HTML तत्वों के बारे में अतिरिक्त जानकारी प्रदान करने के लिए किया जाता है।
आप बाद के अध्याय में विशेषताओं के बारे में अधिक जानेंगे।
<a href="https://www.w3schools.com">This is a link</a>लिंक का गंतव्य विशेषता में निर्दिष्ट है. href
विशेषताओं का उपयोग HTML तत्वों के बारे में अतिरिक्त जानकारी प्रदान करने के लिए किया जाता है।
आप बाद के अध्याय में विशेषताओं के बारे में अधिक जानेंगे।
HTML छवियाँ
HTML छवियों को टैग के साथ परिभाषित किया गया है।<img>
स्रोत फ़ाइल (), वैकल्पिक पाठ (), और विशेषताओं के रूप में प्रदान किए जाते हैं:srcaltwidthheight
HTML छवियों को टैग के साथ परिभाषित किया गया है।<img>
स्रोत फ़ाइल (), वैकल्पिक पाठ (), और विशेषताओं के रूप में प्रदान किए जाते हैं:srcaltwidthheight
उदाहरण
<img src="w3schools.jpg" alt="W3Schools.com" width="104" height="142">
<img src="w3schools.jpg" alt="W3Schools.com" width="104" height="142">
HTML स्रोत कैसे देखें
क्या आपने कभी एक वेब पेज देखा है और सोचा है "अरे! उन्होंने ऐसा कैसे किया?"
क्या आपने कभी एक वेब पेज देखा है और सोचा है "अरे! उन्होंने ऐसा कैसे किया?"
HTML स्रोत कोड देखें:
HTML पृष्ठ में राइट-क्लिक करें और "पृष्ठ स्रोत देखें" चुनें (में) क्रोम) या "व्यू सोर्स" (एज में), या अन्य ब्राउज़रों में समान। इससे एक विंडो खुल जाएगी। जिसमें पृष्ठ का HTML स्रोत कोड शामिल है।
HTML पृष्ठ में राइट-क्लिक करें और "पृष्ठ स्रोत देखें" चुनें (में) क्रोम) या "व्यू सोर्स" (एज में), या अन्य ब्राउज़रों में समान। इससे एक विंडो खुल जाएगी। जिसमें पृष्ठ का HTML स्रोत कोड शामिल है।
0 Comments