Table of Contents
How to Learn HTML
How to Learn HTML in Hindi (HTML कैसे सीखें) Html का full form है, Hypertext markup language यह Web Page बनाने के काम मे आता है। Website का Structure बनाने में भी HTML का इस्तेमाल सबसे ज्यादा होता है। अगर आपको अपनी खुद की वेबसाईट क्रीऐट करनी है तो Html लैंग्वेज को सीखना आपके लिए बहुत जरूरी है।
HTML language को सीखने और इसकी Help से वेब पेज बनाने के लिए आपको HTML टैग्स and HTML attributes के बारे जानना होगा। किसी भी वेब पेज को बेहतरीन Structure देने में Html टैग्स और Html attributes का ही Use किया जाता है। Html एक बहुत ही आसान मार्क अप लैंग्वेज है। इस Article में HTML कैसे सीखे पर हम चर्चा करेंगे। Html element’s व उनके Html attributes क्या है, और इनकी Help से वेब पेज कैसे बनाये। तो चलिए स्टेप बाइ स्टेप जानते है-
HTML लैंग्वेज को सीखने के लिए जरूरी है, Html टैग्स व Html attributes का ज्ञान होना। दरअसल Html तो सिर्फ इस मार्क अप लैंग्वेज का Name है, बाकी सारा काम इन्ही टैग्स व attributes का होता है। अगर आपने इन सारे Html टैग्स व इनके attributes को जान लिया तो आप एक Html एक्सपर्ट भी बन सकते है। इन सबका ज्ञान होने के बाद आपके लिए एक वेबसाईट बनाना बाएं हाथ का खेल होगा। तो चलिए इस Post में अब जानते है। html टैग्स व html attributes क्या है और इनका Use कैसे किया जाता है।
HTML Tag क्या है
किसी वेब पेज के structure को बनाने में Use किये जाने वाले codes को html टैग्स या html element’s कहा जाता है। यह टैग्स angular brackets (<>) के बीच एक सिम्पल टेक्स्ट होता है।
Example के लिए: (<h1> ) यह एक Heading tag है। जिसे heading के स्टार्टिंग वर्ड H से डिफाइन किया गया है। ज्यादातर Tags को भी उनके फर्स्ट वर्ड से ही डिफाइन किया जाता है। इन टैग्स के ओपनिंग व क्लोज़िंग टैग जरूर होते है। html फाइल बनाते वक्त भी इसका खास ख्याल रखा जाता है कि, Use किये जाने वाले टैग का पहले ओपनिंग टैग व लास्ट मे क्लोज़िंग टैग जरूर लिखा जाए तभी वह html फाइल सही से काम करेगी।
अगर आपको किसी वेब पेज में heading लिखनी है। तो आप उसके opening tag <h1> से Start करेंगे। अब अपनी heading लिखने के बाद इसके closing tag </h1> को लिखकर इस Heading टैग को Close करेंगे। इसी तरह बाकी टैग को भी ओपनिंग टैग से Start करके closing tag पर Close किया जाता है। नीचे Example से समझे।
<H1> html kaise sikhe </h1>
Html टैग्स दो Type के होते है:
- Paired html tags
- Unpaired html tags.
Paired html tags: जिन tags के ओपनिंग व क्लोज़िंग दोनों टैग होते है, उन्हें paired html टैग्स कहा जाता है। ज्यादातर HTML टैग्स paired ही होते है। नीचे के Example में heading टैग्स एक paired टैग है। जिसका ओपनिंग टैग <h1> व क्लोज़िंग टैग </h1> है।
<H1> Learn HTML in Hindi </h1>
Unpaired HTML tags: इन टैग्स के कोई ओपनिंग व क्लोज़िंग टैग्स नही होते। यह एक तरह के singular html टैग्स होते है। इन्हें इस तरह से लिखा जाता है। नीचे के Example में एक line break tag (<Br>) है। Paragraph लिखते वक्त किसी एक लाइन को खत्म करके दूसरी लाइन लिखने के लिये ऐसे टैग का Use किया जाता है।
<Br>
कुछ Basic HTML Tags व उनके Uses
1. DOCTYPE tag – यह टैग किसी डॉक्यूमेंट के टाइप को Explain करता है। जैसे यहां पर इस डॉक्यूमेंट का टाइप html है। इस टैग को <!DOCTYPE> से डिफाइन किया जाता है।
2. Html Tag – यह टैग html लैंग्वेज का Main टैग है। html टैग को <html> से डिफाइन किया जाता है। ऐसे टैग से html डॉक्यूमेंट बनाने की Starting की जाती है। बाकी सभी टैग्स इसी html टैग के ओपनिंग व क्लोज़िंग टैग के अंदर लिखे जाते है।
3. Head Tag – एक वेब पेज के हेड पार्ट यानी ऊपरी भाग को इसी टैग की Help से बनाया जाता है। हेड टैग के अंदर ही उस वेब पेज के टाइटल, मेटा description and keyword टैग को लिखा जाता है। इसे <head> से डिफाइन करते है।
4. Body Tag – इस टैग से वेब पेज के कंटेन्ट एरिया की स्टार्टिंग की जाती है। बॉडी टैग को <Body> से डिफाइन किया जाता है। Heading tag, Paragraph tag etc. इसी टैग के अंदर लिखे जाते है। इस टैग की Help से एक वेब पेज के बॉडी एरिया को डिजाइन किया जाता है।
5. Title Tag – किसी वेब पेज का टाइटल लिखने के लिए इस टैग का इस्तेमाल किया जाता है। इस टैग को <title> से डिफाइन किया जाता है।
6. Heading Tag – वेब पेज के कंटेन्ट में Heading लिखने के लिये इस टैग का Use किया जाता है। heading टैग को <h1> से डिफाइन किया जाता है। एक कंटेन्ट में 6 heading टैग का Use किया जा सकता है। जिनके टैग इस प्रकार<h1>, <h2>, <h3>, <h4>, <h5>, <h6> है।
7. Paragraph Tag – इसका Use Paragraph लिखने के लिए किया जाता है। एक कंटेन्ट में आप कई Paragraph टैग का इस्तेमाल कर सकते है। इस टैग को <p> से डिफाइन किया जाता है।
8. Line Break Tag – Paragraph लिखते वक्त एक लाइन को खत्म कर अगली लाइन Start करने के लिये लाइन ब्रेक टैग का use किया जाता है। इस टैग को <br> से डिफाइन किया जाता है।
9. Bold Tag – किसी Important टेक्स्ट को बोल्ड (गहरा) करने के लिये बोल्ड टैग का Use किया जाता है। इस टैग को <B> से डिफाइन किया जाता है।
10. Underline Tag – यह टैग किसी latter को Underline करने के लिए Use किया जाता है। इसे <u> से डिफाइन किया जाता है।
11. Italic Tag – यह टैग किसी latter को इटैलिक करने के लिए इस्तेमाल किया जाता है। इसे <i> से डिफाइन किया जाता है।
HTML Attributes क्या है?
HTML Attributes किसी Html elements (tag) के बारे में एक्स्ट्रा इनफार्मेशन प्रवाइड करने के लिए use किये जाते है। Html फाइल में इन attributes को दो Parts में लिखा जाता है। इसका पहला Part Attributes Name वह दूसरा Part इसकी वैल्यू होता है। एक Html फाइल में इन attributes का Use किसी Html elements के ओपनिंग टैग के साथ किया जाता है। नीचे दिया Example देखे –
<h1 attrname= “value”> Html Kaise Sikhe </h1>
ऊपर दिए गए example में यह एक heading टैग है। जिसे उसके ओपनिंग टैग h1 व क्लोज़िंग टैग h2 से दर्शाया गया है। अब जैसे हमने ऊपर आपको बताया कि, html attributes extra information provide करते है html elements के बारे में। तो अगर हमको इस html फाइल की heading का कलर चेंज करना होगा तो यहां पर हम उस attributes का इस्तेमाल करेंगे जिससे फॉन्ट कलर चेंज किया जा सकता है।
ऐसे ही बहुत सारे attributes होते है, जिसकी Help से हम html टैग्स को extra configure कर सकते है। html फाइल में इन attributes को हमेशा किसी html elements के ओपनिंग टैग के साथ लिखा जाता है। जैसा कि ऊपर उदाहरण में बताया गया है। एक html attributes को उसके नाम व उसकी वैल्यू लिखकर दर्शाया जाता है।
ऊपर दिए गए Example में आप देख सकते है, heading टैग के ओपनिंग टैग h1 के अंदर एक attribute उदाहरण दिया गया है। यहां पर attr-name की जगह कोई भी html attributes का Name हो सकता है। उसके बाद उसकी वैल्यू को Quotation marks [ “ ” ] के अंदर लिखा जाता है। इसी तरह से बाकी HTML attributes को भी लिखा जाता है।
कुछ Basic HTML Attributes व उनका Use
1. Html href attribute – इस attribute का use दो वेब पेज को आपस मे जोडने के लिए किया जाता है। इस attribute को <a> टैग के ओपनिंग टैग में लिखा जाता है। <a> टैग को हाइपर लिंक टैग भी कहा जाता है। <a> टैग का Use किसी टेक्स्ट या इमेज को लिंक देने के लिए किया जाता है। यह टैग दूसरे वेब पेज में जाने की अनुमति देता है। नीचे दिए गए Example में a टैग के ओपनिंग टैग के साथ href attribute को लिखा गया है। यहां पर href इस attribute का नाम है, और https://last-date.com उसकी वैल्यू।
<a href= “https://last-date.com”> last-date.com </a>
2. Html src attribute – अगर आप किसी इमेज को एक html फाइल में ऐड करना चाहते है, और वह इमेज आप अपने Computer या किसी वेब साइट से लेना चाहते है। तो इस इमेज फाइल का सोर्स अड्रेस सेट करने के लिये src attribute का इस्तेमाल किया जाता है। अगर इमेज फाइल computer के उसी Folder में हो जहाँ html फाइल सेव की गई है, तो src attribute का इस्तेमाल कुछ इस तरह से होगा।
नीचे दिए गए Example में, HTML in Hindi एक इमेज का फाइल नेम है। यहाँ पर src attribute को इमेज टैग के ओपनिंग टैग में उसके नाम – src व उसकी वैल्यू – HTML in Hindi.jpg के साथ लिखा गया है।
<image src= “HTML-in-Hindi.Jpg”> </image>
दूसरा Example, अगर इमेज फाइल computer के दूसरे फ़ोल्डर में सेव हो तो src attribute का इस्तेमाल कुछ इस तरह से होगा। इस उदाहरण में इमेज फाइल कंप्यूटर के डाउनलोड फ़ोल्डर में इमेज फ़ोल्डर के अंदर है। इसी तरह से आपके जिस भी फ़ोल्डर में इमेज फाइल सेव हो उस फ़ोल्डर का Name slash लगाकर लिखे तभी आपकी इमेज उस html फाइल में शो होगी।
<image src= “Download/image/HTML-in-Hindi.jpg”> </image>
तीसरा Example, अगर इमेज फाइल एक url के रूप में हो, तब src attribute का इस्तेमाल कुछ इस तरह से होगा।
<image src= “https://last-date.com/HTML-in-Hindi.jpg> </image>
How to Learn HTML
इस पोस्ट मे हमने How to Learn HTML के बारे मे जाना अगर आपका इस पोस्ट How to Learn HTML के बारे मे कोई सवाल या सुझाव हो तो कमेन्ट करे।
Read Also What Is HTML
Pingback: HTML Tag Kya Hai? - Last-Date