Connect with us

tech help

▷Html In Hindi Complete Information-Introduction +11 steps

html in hidi- what is html in hindi- html kya hai in hindi- html in hindi language- html all tags in hindi- introduction to html in hindi

html का नाम तो आपने बहुत बार सुना होगा। लेकिन आपके दिमाग में एक सवाल हमेशा रहता होगा की आखिर html क्या है। कैसे ये काम करता है। और क्या क्या प्रकार html के होते है। और कैसे लिखा जाता है। ऐसे लिखने के क्या क्या आवश्कता होती है। तो आज हम html in hindi complete information देने वाले है। हम आपको सरल हिंदी भाषा में html की पूरी जानकारी प्रदान करने की कोशिश करेंगे। ताकि आपको आसानी html की पूरी जानकारी मिल जाये। सबसे पहले हम आपको ये जानकारी देना चाहते है। की आज हम जिन html के जिन टॉपिक पर बात करेंगे। उनकी पूरी लिस्ट हमने बनाई है। जो की आपको इस पेराग्राफ के निचे मिल जाएगी। अगर आपको इस के किसी भी टॉपिक की पूरी जानकारी है। तो आप उसे छोड़ सकते है। किसी भी निर्धारित टॉपिक को पढ़ने के लिए आपको केवल उस टॉपिक की लाइन तो टच करना होगा।

और आप उसी टॉपिक पर चले जायेंगे। आपको पेज ऊपर या निचे खिसकाने का कार्य नहीं करना होगा। आपकी जानकारी के लिए आपको बता दे की ये कार्य भी html के कारण ही होगा। हमने html के कुछ कोड जोड़े है। जिनकी मदद के ये कार्य किया जाता है। आज हम आपको केवल html की बेसिक जानकारी प्रदान करेंगे।

भविष्य में हम आपको निरंतर कुछ नया बताने कोशिश करेंगे। ताकि आप अपनी भाषा हिंदी में html की सारी जानकारी प्राप्त कर पाए। तो चलिए हम शुरुआत करते है। html के बारे में।

html in hindi complete information list

html क्या है और पूरा नाम क्या है।
HTML को Markup Language क्यों कहा जाता है।
html भाषा की कोनसी पीढ़ी चल रही है।
html हिस्ट्री क्या है।
Features Of HTML In Hindi
html कोडिंग काम कैसे करता है।
html कोडिंग करने के लिए क्या क्या आवश्कता की चीजे।
html को लिखने का शुरआती रूल क्या है।
html टैग क्या होते है।
html में अधिक उपयोगी टैग क्या है।
CSS क्या है। और पूरा नाम क्या है।
CSS के कितने प्रकार होते है।

html क्या है और पूरा नाम क्या है।

सबसे पहले हम बात करते है। html क्या है। और किस प्रकार ये कार्य करता है। और ये क्या कार्य करता है। और html का पूरा नाम क्या है। html एक भाषा है। इसका पूरा नाम Hypertext Markup Language है। html भाषा कम्प्यूटर समझता है। और html में दिए गए निर्देशों का पालन करता है। और उन्ही निर्देशों के पालन करते हुए हमे टेक्स्ट और इमेज स्क्रीन में दिखता है। किसी भी webpage या वेबसाइट बनाने के लिए html ,CSS और java script का उपयोग किया जाता है।

जिसमे html का कार्य केवल टेक्स्ट और इमेज को webpage में केवल प्रदर्शित करने का होता है। और CSS ये भी एक कम्प्यूटर की भाषा है। CSS का कार्य ये होता है। की इसकी मदद से आप किसी भी टेक्स्ट ,इमेज और वेबपेज का कलर ,आकर बदल सकते है। जैसे किसी टेक्स्ट का कलर लाल ,नीला ,हरा कर सकते है। इमेज को छोटा या बड़ा कर सकते है। और टेक्स्ट ,इमेज को दाएँ ,बायें या ऊपर निचे कर है। अब बात करे java script की तो इसका कार्य भी कुछ CSS की ही तरह किया जाता है।

लेकिन ये किसी विशेष एलिमेंट को दिखाने, छुपाने या किसी फाइल को ब्रौजर रन करने के लिए किया जाता है। लेकिन आज हम केवल बेसिक जानकारी की बात कर रहे है। इसलिए अधिक गहराई में जाने की आवश्कता नहीं है। आने वाले समय में हम सभी भाषाओ को बारीकी से समझेगे। पूरी जानकारी प्राप्त करेंगे। html भाषा कुछ इस प्रकार दिखाई देती है। जैसा की आप इस इमेज सकते है।

Html In Hindi complete information, html in hidi- what is html in hindi- html kya hai in hindi- html in hindi language- html all tags in hindi- introduction to html in hindi

 

इस html को ब्रॉउजर पढ़ता है। समझता है। और जैसा निर्देश दिया होगा उसी प्रकार स्क्रीन में दिखायेगा। आप जो लाइन या पाठ पढ़ रहे है। ये भी इसी html में लिखा गया है। इसी प्रकार intrnet में जितनी भी जानकारी आप लेते है।

वो इसी html भाषा में लिखी गयी है। और कंप्यूटर इसे आसान बना कर आपको दिखता है। और हम आसानी से जानकारी प्राप्त कर है। भाषा में लिखी गयी है। और कंप्यूटर इसे आसान बना कर आपको दिखता है। और हम आसानी से जानकारी प्राप्त कर पाते है।

HTML को Hypertext Markup Language क्यों कहा जाता है।

Hypertext :

Hypertext यह एक साधारण टेक्स्ट ही ही होता है। लेकिन, Hypertext अपने साथ किसी अन्य टेक्स्ट को जोड़े रखता है। और जैसे ही आप उस टेक्स्ट पर क्लीक करते है। तो आप उस पाठ में पहुंच जाते है। जो लिंक टेक्स्ट के साथ जुड़ा होता है। इस साधारण भाषा में Hyperlink भी कहा जाता है।

आपकी जानकारी के लिए बता दू की इस पेज में ऊपर की तरफ कुछ मेनू है। अगर आप इन मेनू में से किसी भी मेनू को क्लीक या ओके करते है। तो आप हमारे वेबसाइट के एक नए WEBPAGE में जायेंगे। ऐसा इसी कारण होगा की उन टेक्स्ट में Hyperlink जोड़ा गया है। ऐसी प्रकार हम इंटरनेट से जितनी भी जानकारी प्राप्त करते है।

वो हमे Hyperlink की मदद से ही प्राप्त होती है। Hypertext की ये ही विशेषता इसे साधारण टेक्स्ट से अलग करती है। इसी प्रकार अन्य मीडिया फाइल को भी Hypertext के साथ जोड़ कर Hyperlink बनाया जाता है। किसी भी टेक्स्ट को Hyperlink बनाने के लिए <a ></a >टैग का उपयोग किया जाता है।

Hyperlink लिंक को टेक्स्ट के साथ साथ किसी भी क्रम में जोड़ा जा सकता है। इसका उपयोग करने के लिए कोई निश्चित नियम नहीं है। आशा करता हु की आप इतना तो जान ही गए होंगे की आखिर Hyperlink क्या होते है। और कैसे काम करते है। तो चलिए हम बात करते है। की Hyperlink के कितने प्रकार होते है।

 

  • Local link: same लोकेसन के पेज को लिंक करने के लिए लोकेल लिक का उपयोग किया जाता है। जैसे अपने ही वेबसाइट के अगल अगल पेज यानि कॉन्टेकट करने का पेज या about     उस पेज आदि को लिंक करना लोकेल लिंकिंग में ही आता है।

 

  • internal link : इसका उपयोग उस समय किया जाता है। जब हमारे द्वारा दी जाने वाली जानकारी से जुडी कोई जानकारी अन्य पेज पर मौजूद होती है। जो उस जानकरी को इस जानकारी  से जोड़ने के लिए इंटरनल लिंक का उपयोग किया जाता है।

 

  • external link : इसका उपयोग उस समय किया जाता है। जब हम कोई जानकारी प्रदान करते है। किसी विषय में और उसी से जुडी कोई जानकारी किसी अन्य वेबसाइट में उपलब्ध होती     है। तो उस जानकारी को हम अपनी जानकरी से जोड़ते है। तो उन दोनों जानकारियों को आपस में जो लिंक जोड़ती है। उसे हम external link कहते है।

 

  • download link : जब हम वेबपेज में किसी फाइल को download करने का लिंक प्रदान करते है।तो उसे डाउनलोड लिंक कहते है। जैसे – कोई वीडियो ,ओडीओ,इमेज ,पीडीऍफ़ आदि। को डाउनलोड करने के लिए दी जाने वाली लिंक।

 

  • e-mail link: इस लिंक का संबंध यूजर के मेल बॉक्स के साथ किया जाता है। जो की यूजर के सिस्टम्म में e mail को ओपन ओपन करता है।

markup के बारे में।

html वेब पेज बनाने के लिए “HTML Tags” का उपयोग किया जाता है. प्रत्येक HTML Tag के बीच आने वाले टेक्स्ट को किसी प्रकार में परिभाषित करता है. इसलिए ही इसे Markup कहा जाता है।

“<b>” एक HTML Tag है जो अपने बीच आने वाले टेक्स्ट को bold करता है। यानिकि गहरा मोटा करता है। और इसी प्रकार “<h1> भी एक टैग है। ये टेक्स्ट का आकर बढ़ता है। यानिकि बड़ा करता है।

हम उदाहरण से समझते है।

जैसे हमने एक शब्द लिखा है। ” लव माय इंडिया ” जिसे साधारण लिखा गया है. जो हमें एक साधारण भाषा में साधारण ही टेक्स्ट की तरह दिखाई दे रहा है।अब हम इसे HTML के द्वारा Markup करते है. और Markup मे हम इसे बोल्ड यानिकि गहरा काला करते है। इसके लिए हम इसे <b >लव माय इंडिया</b > इस प्रकार लिखना होगा। जैसे ही हम इस प्रकार लिखेंगे तो ये टेक्स्ट हमे लव माय इंडिया इस प्रकार दिखाई देगा।

Language:

जैसा की हमने आपको पहले बताया की html एक कंप्यूटर भाषा है। जो कंप्यूटर समझता है। और भाषा को अंग्रेजी भाषा में Language ही कहते है।

html भाषा की कोनसी पीढ़ी चल रही है।

HTML भाषा का जन्म 90 के दशक में हुआ था और अभी भी इस भाषा का उपयोग बहुत अधिक मात्रा में किया जाता है। इस भाषा का अविष्कार माननीय Sir Tim Berners Lee के द्वारा किया गया था। वर्तमान समय में HTML के विकाश जिम्मा “World Wide Web Consortium (W3C)” के पास है।

अब वर्तमान में html का नम्बर 5 वेरगेन यानिकि पांचवी पीढ़ी चल रही है। जिस प्रकार 2g, 3g औऱ 4g मोबाईल नेटवर्क की पीढ़ी है। उसी प्रकार html भी 5 वी पीढ़ी में चल रही है।

html हिस्ट्री क्या है।

जैसा की हमें ऊपर कुछ लाइन में जिक्र किया था। की html का जन्म करता का नाम Tim Berners Lee था। और वे एक भौतिक विशेषज्ञ थे। उन्होंने ही 90 के दशक में html निर्माण किया। जिस समय उन्होंने html का निर्माण करने का निर्णय लिया तो उनका एक ही मोटिव था। की किसी भी वेबसाइट को बनाने अलग अलग भाषाओ का उपयोग करने के बजाय एक ऐसी भाषा का निर्माण होना चाहिए।

जो हर प्रकार के ब्रौज़र में काम कर पाए। और हर ब्रौज़र उस भाषा को समझ सके और सही से काम कर पाए। ऐसा करना इसलिए जरूरी था। क्योकि उस समय कोई भी ऐसी एक भाषा नहीं थी। जो हर प्रकार के ब्राउज़र समझ पाए। और ऐसी कारण अलग अलग ब्राउज़र के लिए अलग अलग भाषा का उपयोग किया जाता था।

तब Tim Berners Lee ने इस परेशानी को दूर करने के मकशद से html टैग का निर्माण किया। जिस समय html का निर्माण किया गया था। उस समय ये html इतनी एडवांस नहीं थी। लेकिन धीरे धीरे समय के साथ साथ इसमें बहुत से बदलाव किये गए। तो चलिए हम जानते है। की क्या सफर तय किया हैं। और कोनसे बदलाव किये गए थे।

html in hindi -updated history list

  • HTML 1.0

सबसे पहले HTML 1.0 का निर्माण किया गया , जब स्टार्टिंग की गयी थी तब इसको केवल HTML के नाम से जाना जाता था। क्यूंकी उस वक्त किसी को कोई अनुमान नहीं था। की भविष्य में html का प्रचलन अधिक बढ़ने वाला है। और इसी के कारण इसमें और अधिक सुधार करने होंगे।

  • HTML 2.0

प्रथम अपडेट के बाद IETF – Internet Engineering Task Force के द्वारा HTML नेक्स्ट अपडेट किया गया। HTML 2.0 इसमें प्रथम अपडेट से अधिक सुधार किया गया। और इस अपडेट को वर्ष 1995 में प्रकाशित किया गया। इस अपडेट में ‘Image Tag’ जोड़ा गया था। जो की अधिक महत्वपूर्ण था।

  • HTML 3.0

जब HTML 3.0 अपडेट किया गया था। उस सयम तक HTML और Internet दोनों ही अधिक लोकप्रिय हो चुके थे। और इनका उपयोग करने वाले लोगो की संख्या में भी वृद्धि हो चुकी थी। अब लोग html को सिखने और इंटरनेट से जुड़ने में अधिक दिलचस्पी दिखने लगे थे।
html को अधिक उपयोग होने के कारण इसमें कुछ कमिया भी महसूस होने लगी थी। अब इस परेशानी से निजात पाने के लिए एक Standard रूल पारित किया गया। और लोग उसी Standard से काम करने के लिए प्रेरित हुए।

  • HTML 3.2

अब HTML का अगला अपडेट किया गया जिसे HTML 3.2 का नाम दिया गया। इसमें पहले अपडेट से भी अधिक विशेषता थी। HTML 3.2 के अपडेट के कारण अब HTML Document को और अधिक आसान तरीके से बनाया जा सकता था। साथ हि इसमें कुछ Attribute’ को भी जोड़ा गया था। जो अधिक सराहनीय अपडेट रहा था।

  • HTML 4.0

HTML 3.2 के बाद अब बारी आयी थी अगले अपडेट की जिसका नाम HTML 4.0 था। जब तक इस अपडेट को जोड़ा गया था। तब तक तो Internet की लोकप्रियता कई गुना अधिक हो चुकी थी। और अधिक लोग HTML सीखना चाहते थे। और जो लोग पहले से ही html और इंटरनेट से जुड़े थे। वे HTML और ईंटरनेट से अधिक सिखने और जानने के इच्छुक हो चुके थे।

और ऐसी भरी डिमांड पूरा करने की आवश्यकता था। इसलिए अब HTML 4.0 का अपडेट को जोड़ा गया। जो काफी शॉर्टकट थी। जिसके कारण काम समय में अधिक डाटा को प्रदर्शित किया जा सकता था। इसमें कुछ और टैग भी जोड़े गए थे। जैसे – frame, script, style sheet आदि। अब ब्रौज़र इस डाटा को तेजी से पढ़ पते थे। और अधिक तेजी से ही डिस्प्लै कर पाते थे। यह अपडेट भी अधिक कामयाब रहा था।
पहले के मुकाबले अब इसे पढ़ने वाले ब्राउज़र भी अब कुछ हद तक एडवांस हो चुके थे जो कि HTML के अधिकतर विशेषताओं को पढ सकते थे.

  • HTML 4.01

अब HTML 4.0 के बाद HTML 4.01 के नाम से एक और अपडेट किया गया था। इसे W3C द्वारा 1999 में किया गया था। पीछे की ही भांति इसमें भी कुछ टैग आदि जोड़ कर इसे अधिक कुशल बनाया गया था। जो एक सराहनीय अपडेट था।

  • HTML 5

हम आपको बता दे की आज के जितने भी वेबपेज या वेबसाइट मौजूद है। वो सभी इसी अपडेट में शामिल है। अभी तक HTML का सबसे नवीनतम अपडेट HTML 5 है। और ये काफी तक एडवांस है। इसमे HTML 4.01 की विशेषताओं के अलावा XML कि विशेषताएं शामिल है| यह संस्करण धीरे-धीरे अपनी पहचान पूरी दुनिया में में बना रहा है। आज के समय में सबसे अधिक उपयोग की जाने वाली भाषा है।

Features Of HTML In Hindi

आज के समय में html lenuage का बहुतायत उपयोग किया जा रहा है। आज के आधुनिक युग में। इंटरेनट के जगत में html बोलबाला छाया हुआ है। तो चलिए हम इसके कुछ फीचर की जानकारी भी जुटाते है।

  • जैसा की हम आपको बता दे की आज के युग में जो html 5 का उपयोग किया जाता है। जो की शुरुआती दौर की html से बहुत ही अधिक सिंपल और आसान है। जैसा की हमने आपको बताया की किस प्रकार html को अपडेट किया गया। इन्ही अपडेट की वजह से आज html इतनी आसान हो गयी है। की आप इसे बहुत ही कम समय में सिख सकते है।

 

  • html का एक यह बहुत ही बड़ा फायदा है। की आप html को किसी भी ब्रौज़र में ओपन कर सकते है। और html में बने किसी भी डॉक्यूमेंट आप किसी भी सॉफ्टवेर और ब्रौज़र रन करवा सकते है।

 

  • अगर आप कोई डॉक्यूमेंट या वेबपेज निर्माण html में करते है। तो आप उस में कोई भी इमेज ,वीडियो ,ऑडिओ ,gif आदि का उपयोग कर सकते है। जिसके कारण वेबपेज में सुंदरता को अधिक बढ़ावा मिलता है। और ब्रौज़र उन सभी को डिस्प्लै करता है।

 

  • html के डॉक्यूमेंट में आप कोई भी अन्य वेबपेज या डॉक्यूमेंट फाइलें को भी जोड़ सकते है। और उसी वेबपेज में दिखा सकते है। इसके लिए आपको केवल लिंक टैग का उपयोग करना होगा। जो की हम पहले ही जान चुके है। की आखिर लिंक टैग क्या होते है। और इनका क्या उपयोग होता है।

 

  • html एक बहुत आसान भाषा होती है। इसमें सबसे अछि बात ये है। की ये case sensitive language नहीं होती है। case sensitive language आसान भाषा में जाने तो html में उपयोग किये जाने वाले टैग को आप केपिटल या स्माल लेटर में भी लिख सकते है। और ब्रौज़र भी उनको आसनी से पढ़ सकता है। हालाँकि हम आपको बता दे की बहुत ही कम या न समान ही ऐसे टैग आपको देखने के लिए मिलेंगे जिनमे स्माल या केपिटल लेटर का रूल लागु होता है।

html काम कैसे करता है।

html का उपयोग क्या होता है। ये तो आप जान ही चुके है। लेकिन आपके दिमाग में अब सवाल आना तो बनता ही है। की आखिर ये काम कैसे कैसे है। तो चलिए हम आपको ये जानकारी में प्रदान करते है। की आखिर ये काम कैसे करता है। html को लिखने के लिए आप कोई नोटपैड का उपयोग करना होगा। आप अपने लैपटॉप या कम्यूटर में नोटपैड को खोलना है। और उस में html कोड को लिखना है। जैसा की आप निचे इस इमेज में देख सकते है।

Html In Hindi complete information, html in hidi- what is html in hindi- html kya hai in hindi- html in hindi language- html all tags in hindi- introduction to html in hindi

अब आप इस सारे कोड को लैपटॉप में सेव कीजिये। सेव करने के लिए आप लैपटॉप में ctrl +s बटन को दबाएंगे तो आपको ये फाइलें सेव करने का चिन्ह दिखाई देगा। आप उस चिन्ह को जैसे ही दबाएंगे तो आपके सामने फाइल को सेव करने के लिए redy हो जायेगा। लेकिन आपको ये ध्यान देना है की फैले .html का टाइप में ही सेव करे। जैसा की आप इमेज में देख सकते है। आपको निचे तरफ दिखाई दे रहा है।

Html In Hindi complete information, html in hidi- what is html in hindi- html kya hai in hindi- html in hindi language- html all tags in hindi- introduction to html in hindi

जैसे ही आपके ब्रौज़र में फाइलें सेव होती है। आपको उस फाइल को राइट क्लीक बटन से ओपन विथ क्रोम में खोल लेना है। इसके बाद आप देख्नेगे की आपने जैसा कोड लिखा था। उसी कोड ब्रौज़र पढ़ कर आपको डिस्प्लै में दिखायेगा। जैसा की मेने ये कोड लिखा था। जो मेने आपको ऊपर इमेज में दिखाया है। तो में इस कोड को क्रोम ब्रौज़र में खोलूँगा तो कुछ इस प्रकार दिखाई देगा। आप इस इमेज में देख सकते है।

Html In Hindi complete information, html in hidi- what is html in hindi- html kya hai in hindi- html in hindi language- html all tags in hindi- introduction to html in hindi

दोस्तों अब तक हमने आपको बताया है। की html क्या है। कैसे काम करता है। क्या इसके टैग होते है। कितने प्रकार के टैग होते है। और भी बेसिक जानकारी दी है। आशा करता हु कि आपके दिमाग में जो बेसिक सवाल थे। उनका जवाब आपको मिल चूका है। अब हम आपको बतात्ते है। की html कोड को कैसे लिखना है। क्या क्या रूल फॉलो करने है। कोड को लिखने के लिए आपको क्या क्या आवश्कता के टूल चाहिए। तो चलिए ये भी जान ही लेते है।

html कोडिंग करने के लिए क्या क्या आवश्कता की चीजे।

html कोड को लिखने के लिए आपको कोई भी अधिक टोल की आवश्कता नहीं होती है। न ही कोई सॉफ्टवेर खरीदने की आवश्कता है। केवल एक लैपटॉप या कंप्यूटर की आवश्कता होगी। अगर आपके पास लैपटॉप या कम्प्यूटर नहीं है। तो आप { raspberry pi } नाम का एक toll खरीद लीजिये।

जो बहुत ही काम पैसो में आपको मिल जायेगा। आपकी जानकारी के लिए बता दू। की raspberry pi एक छोटा कम्प्यूटर ही मान सकते है। इसमें वो सारे काम कर पाएंगे जो आप लैपटॉप में करते है। इसमें आपको कोई डिस्प्लै नहीं मिलती है। इसके लिए आप raspberry pi को अपने घर के led टीवी के साथ जोड़ सकते है।

raspberry pi के बारे में अधिक जानकारी के लिए आप गूगल की मदद ले सकते है। अब आपको उस में notepad ++ या विजुअल स्टूडियो कोड एडिटर को इनस्टॉल करना होगा। और बस आपका काम बन गया। अब आप आसानी से कोडिंग स्टार्ट कर सकते है।

html को लिखने का शुरआती रूल क्या है।

हमने html के बेसिक जानकारी के बारे में लगभग सारी जानकारी प्राप्त कर ली है। लेकिन html एक काफी बड़ा टॉपिक है। जो हम धीरे धीरे जानेंगे कम्प्लीट एक्सपेरिमेंट के साथ ताकि आपको पूरी जानकारी एक ही स्थान में मिल जाये और आपको इधर उधर जाने की आवश्कता न रहे। अब हम ये जान लेते है।

की html कोड को लिखने शुरुआत कहाँ से होती है। और क्या रूल होता है। html को लिखने का तो चलिए ये जानकारी भी हम जानते है। सबसे पहले आपको ब्रौज़र बताना होगा की फाइल का taype क्या है। इसके लिए आपको सबसे <!DOCTYPE html> टाइप करना है।

Html In Hindi complete information, html in hidi- what is html in hindi- html kya hai in hindi- html in hindi language- html all tags in hindi- introduction to html in hindi

उसके बाद आपको <html> <head ><meta charset=”utf-8″><body ></body ></head ></html> लिखना होता है। ये लिखना ही होता है। इसके बाद बाकि का सारा कॉड लिखना होता है। इसको लिखना का तरीका कुछ इस प्रकार है। जो आप इस इमेज में देख सकते है। हमे लगता है। की आप html कोड को लिखने तरीका समझ गए होंगे। जो की बहुत ही आसान है।

html टैग क्या होते है।

html टैग क्या होते है। html में किसी भी टेक्स्ट का आकर बढ़ना या किसी टेक्स्ट को बड़ा दिखाना या छोटा दिखना या फिर कोई भी और प्रकार से प्रदर्शित करना। या किसी इमेज या वीडियो को वेबपेज में जोड़ना। और भी बहुत से कार्य करने के लिए टैग का उपयोग किया जाता है। टैग लगाने से ब्रौज़र उस टैग को पढ़ता है। और फिर जिस भी प्रकार का teg आपने दिया होता है। उसी प्रकार से मीडिया या टेक्स्ट को मोबाईल या किसी भी स्क्रीन में यूजर को दिखाता है। इस प्रकार html में टैग कार्य करते है।

html में अधिक उपयोगी टैग क्या है।

अब हम आपको html के कुछ टैग के बारे में जानकारी प्रदान करते है। जिनका उपयोग अधिक किया जाता है। और html को सिखने के लिए शुरुआती दौर में आपको इन टैग की जानकारी होना बहुत ही जरूरी है। इसलिए हम आपको ये जानकारी प्रदान करते है। ताकि आप हमारी इस एक पोस्ट को पढ़ने के बाद ही एक सिंपल वेबपेज का निर्माण कर पायेंगे। आपको थोड़ी थोड़ी जानकारी इकठा करने की आवश्कता नहीं होगी। इधर उधर जा कर। तो चलिए हम जानते है। की वो कोनसे html टैग है। जिनका उपयोग अधिक किया जाता है।

  • हेडिंग टैग

सबसे अधिक उपयोग में लिए जाने वाले टैग में सबसे पहला टैग है। <h1> से <h6 > इनका उपयोग टेक्स्ट के आकर को बड़ा करके दिखने का होता है। जिसमे <h1> सबसे बड़ा आकर देता है। टेक्स्ट को और इसी प्रकार <h2>,<h3>,<h4>,<h5>,<h6>अपने क्रम के अनुसार टेक्स्ट को आकर प्रदान करते है।

  • Bold tag

इस टैग को कुछ इस प्रकार लिखा जाता है। <b> टेक्स्ट </b> इस टैग के बिच में जहाँ टेक्स्ट लिखा है। उस स्थान में कोई भी टेक्स्ट लिखा जायेगा। तो ब्रौज़र उस टेक्स्ट को बोल्ड (गहरा मोटा) करके डिस्प्लै में दिखाएगा।

  • Italic tag

इटैलिक टैग कुछ इस प्रकार लिखा जाता है। <i>टेक्स्ट </i> इस टैग के बिच में जहाँ टेक्स्ट लिखा है। उस स्थान में लिखा जाने वाले टेक्स्ट को ब्राउज़र तिरछा कर के डिस्प्लै करता है।

  • Underline tag 

किसी भी टेक्स्ट के निचे एक सीधी लाइन खींचने के लिए <u> टेक्स्ट </u> टैग का उपयोग किया जाता है। इसका उपयोग भी इसी प्रकार किया जाता है। जैसा की ऊपर बताया गया है आपको केवल टैग के बिच अपना टेक्स्ट लिखना है।

  • Small tag

अपने लिखने जाने वाले पाठ में किसी टेस्ट को छोटा आकर प्रदान करने के लिए <small> टेक्स्ट </small> इसका उपयोग किया जाता है। अन्य टैग में अनुसार ये भी कार्य करता है।

  • Font Colour tag

अगर आप किसी भी फॉण्ट को कोई कलर प्रदान करना चाहते है। तो आप <font color=”#??????”> </font> इस टैग का उपयोग कर सकते है। इसमें आपको color के आगे वाले स्थान में कलर कोड डालना होता है। किसी भी कलर के कोड को खोजने लिए आपको गूगल में केवल कलर का नाम और हेक्सकोड लिखाना है। आपको कॉड मिल जायेगा।

  • Font Size tag

किसी भी फॉण्ट साइज को अपनी इच्छा के अनुसार बड़ा या छोटा करने के लिए आपको <font size=”?”> </font> इस टैग का उपयोग करना होगा। साइज के स्थान में साइज लिखना है। और टैग के बिच में टेक्स्ट लिखना है। जिसका साइज सेट करना चाहते है।

  • Centre tag

किसी भी टेक्स्ट को डिस्प्लै बॉडी के सेंटर में दिखने के लिए <center> </center> इस टैग उपयोग किया जाता है। इसका उपयोग करने का तरीका भी सेम ही है।

  • paragraph tag

वेबपेज में कुछ टेक्स्ट लाइनों को समूह यानिकि पेराग्राफ में लिखने के लिए <p >टेक्स्ट </p >इस टैग का उपयोग किया जाता है। जिसके कारण इस टैग में दी गयी लाइने अन्य टेक्स्ट से भिन्न हो कर पेराग्राफ में बदल जाती है।

  • Emphasis tag 

किसी भी पेराग्राफ की कोई भी चयन की गयी लाइन को तिरछा दिखने के लिए <em> </em>इस टैग का उपयोग किया जाता है। यह टैग भी कुछ इटैलिक टैग के समान ही कार्य करता है। लेकिन आपके ब्राउज़र के अनुसार भिन्न हो सकते हैं।

  • Strike-out tag

अगर आप किसी भी टेक्स्ट लाइन को कटिंग दिखना चाहते है। तो आपको <strike> </strike>इस टैग का उपयोग करना होगा। जैसा की आप देख सकते है। की इस टैग का उपयोग करने के बाद लाइनें कटिंग कैसे दिखाई देंगी। डेमो – totle for xyzexperiment totle for xyzexperiment totle for xyzexperiment

  • Preformatted Text 

आप <pre> </pre> इस टैग का उपयोग टेक्स्ट में मध्य स्पेश पैदा करने उपयोग कर सकते है। इस टैग का उपयोग कर के आप जितना भी स्पेश देंगे। टेक्स्ट के मध्य ब्रौज़र उस स्पेश को बिना हटाए ही आपको दिखायेगा।

  • Source Code tag

किसी भी टेक्स्ट को एक विशेष लक्षण में दिखाने के लिए <code> </code> इस टैग का उपयोग किया है। यह टैग जिस टेक्स्ट पर उपयोग किया जाता है। वह अन्य टेक्स्ट से भिन्न दिखाई देता है।

  • Typewriter Text tag

किसी भी टेक्स्ट को टाइपराइटर द्वारा निर्धरित चौड़ाई में लिखने के लिए <tt> </tt> इस टैग का उपयोग किया जाता है। किसी भी टेक्स्ट को प्रिंट योग्य बनाने के लिए उपयोगी है।

  • Block Quote tag

<blockquote cite=”url “></blockquote> इस कोड का उपयोग उस समय किया जाता है। जब हम अन्य किसी वेबसाइट से कोई पेराग्राफ या टेक्स्ट अपनी वेबसाइट में उपयोग करते है। और इस टैग में cite: के आगे हम उस वेबसाइट url डालते है। जिस वेबसाइट से टेक्स्ट लिया गया है। यूआरएल डाल कर हम ब्रौज़र को ये बताते है। की ये टेक्स्ट कहाँ से लिया गया है। हालाँकि यूआरएल डिस्प्लै में दिखाई नहीं देता है। डिस्प्लै में केवल टेक्स्ट ही दिखाई देता है।

  • order list tag

किसी भी टेक्स्ट लाइन को एक ऑडर में यानिकि एक ही स्टाइल में लिखने के लिए <ul>टेक्स्ट</ul>इस टैग का उपयोग किया जाता है।

किसी भी टेक्स्ट लाइन को  unorder में यानिकि एक ही स्टाइल में लिखने के लिए <ul>टेक्स्ट</ul>इस टैग का उपयोग किया जाता है।
इसका उपयोग कुछ इस प्रकार किया जाता है।

<ul>
<li>one</li>
<li>two</li>
<li>three</li>
</ul>
  • unorder list tag

किसी भी टेक्स्ट लाइन को different list आर्डर टाइप्स में लिखने के लिए <ol></ol>इस टैग का उपयोग किया जाता है। इसमें आपको डिफाइन करना होगा जिस स्टाइल में लिखना है। रोमन या अल्फाबेट जैसा की आप निचे कॉड में देख सकते है।
इसका उपयोग कुछ इस प्रकार किया जाता है।

<ol style=”list-style-type:upper-roman”>
<li>one</li>
<li>two</li>
<li>three</li>
</ol>

<ol style=”list-style-type:lower-alpha”>
<li>one</li>
<li>Two</li>
<li>three</li>
</ol>

  • big text tag

किसी भी टेक्स्ट को बड़े आकर में दिखने के लिए इस <big>text</big>टैग का उपयोग किया जाता है।

  • break tag 

किसी भी टेक्स्ट लाइन को पूर्ण देने के लिए <br /> इस टैग का उपयोग किया जाता है।

  • button tag

किसी भी वेबपेज में किसी बटन के निर्माण के लिए <button>text</button>इस टैग का निर्माण किया जाता है। जैसे की आप कोई कॉन्टेक्ट बटन या क्लीक बटन का निर्माण करते है। तो आप इस टैग का उपयोग करेंगे।

  • div tag

<div></div>इस टैग का उपयोग उस समय किया जाता है। जब आप कुछ पेराग्राफ या एलिमेंट को एक ग्रुप में शामिल करना चाहते है।अधिक बार ऐसा इसलिए किया जाता है। जब हम एक से अधिक पेराग्राफ या एलिमेंट में कोई बदलाव एक साथ करना चाहते है।

  • mark tag 

<mark></mark>इस टैग का उपयोग उस समय किया जाता है। जब आप अपने लिखे गए पाठ में किसी भी टेक्स्ट या किसी टेक्स्ट लाइन को अगल दिखाना चाहते है। उस स्थिति में वो टेक्स्ट या टेक्स्ट लाइन ब्रौज़र के डिस्प्लै में हाईलाइट हो कर दिखाई देने लगती है।

  • noframes tag 

किसी आप किसी एलिमेंट ब्रौज़र में शो नहीं करना चाहते है। तो आप <noframes></noframes>इस टैग का उपयोग कर सकते है।

  • quotation tag 

किसी भी टेक्स्ट को कोट्स में दिखने के लिए आप इस टैग उपयोग किया जाता है। इस टैग के मद्द्य लिखा जाने वाला टेक्स्ट आपको ब्रौज़र स्क्रीन में कुछ इस प्रकार दिखाई देता है। जैसे -“totle for xyzexperiment totle for xyzexperiment totle for totle for xyzexperiment totle for”

  • script tag

html वेबपेज में किसी भी प्रकार की स्क्रिप्ट को दर्शाने के उदेश्य से <script></script>इस टैग का उपयोग किया जाता है। स्क्रिप्ट टैग को ब्रौज़र पढ़ता है। और जैसा की उस स्क्रिप्ट में कोड होता है। उसे रन करता है।

  • span tag

span टैग को डिव टैग का ही एक छोटा रूप मान सकते है।<span>टेक्स्ट </span> इस टैग का उपयोग किसी डिव टैग या पेराग्राफ में आंतरिक भाग में भी उपयोग किया जा सकता है। इस टैग के भीतर रखे जाने वाले टैग को ब्रौज़र एक अलग एलिमेंट समझता है। इस स्पान टैग में आप अलग आइडी या क्लास का उपयोग भी कर सकते है।

  • table tag

html में किसी टेबल का निर्माण करने के लिए <table></table> का उपयोग किया जाता है।

  • textarea tag

किसी भी वेबपेज में टेक्स्ट लिखने योग्य स्थान प्रदान करने के लिए <textarea></textarea>इस टैग का उपयोग किया जाता है।

  • title tag 

वेबपेज में लिखे जाने वाले पाठ का शीर्षक बताने के उदेश्य से <title></title>इस टैग का उपयोग किया जाता है।

  • style tag

अगर आप किसी भी एलिमेंट को CSS स्टाइल प्रदान करना चाहते है। तो आपको <style></style>इस टैग का उपयोग करना होता है।

  • strong tag

अगर आप पाठ लिखते है। और आप उस पाठ की कुछ लाइन या टेक्स्ट को अधिक प्रभावी दिखाना चाहते है। तो आप <strong>टेक्स्ट </strong>इस टैग का उपयोग कर सकते है।

  • img tag 

किसी भी वेबपेज में कोई इमेज जोड़ने के लिए <img></img>इस टैग का उपयोग किया जाता है।

  • h1 tag

हमारे द्वारा लिखे जाने वाले पाठ की मुख्य हेडिंग को दर्शाने के लिए <h1></h1>इस टैग उपयोग किया जाता है।

  • class tag

हमारे द्वारा लिखे जाने वाले पाठ एक से अधिक पेराग्राफ डिव शामिल होते है। लेकिन हम किसी भी एक पेराग्राफ या डिव को एक अलग पहचान प्रदान करने के उदेश्य से क्लास का उपयोग करते है। क्लास को कुछ इस प्रकार लिखा जाता है। <div class=”city”> या <p class=”city”>जैसा की आप देख सकते है। की हमने इसमें क्लास के आगे city लिखा है। यह एक अलग पहचान है। ऐसी प्रकार एक से अधिक क्लास आईडी का उपयोग किया जा सकता है। लेकिन ध्यान रहे की हर क्लास को अलग आईडी देनी होती है। जैसा हमने सिटी लिखा है। उस स्थान में आप कोई भी शब्द लिख सकते है।

  • a href tag

किसी भी टेक्स्ट को लिंक प्रदान करने के लिए हम <a >टैग का उपयोग करते है। जैसे <a href=”url”>link text</a> इसमें यूआरएल के स्थान में आप वो यूआरएल डालेंगे जो आप टेक्स्ट में देना चाहते है। और लिंक टेक्स्ट के स्थान में आप वह टेक्स्ट लिखेंगे जिस टेक्स्ट पर आप लिंक जोड़ना चाहते है।

CSS क्या है। और पूरा नाम क्या है।

CSS भी एक कम्प्यूटर भाषा है। और इसका पूरा नाम कास्केडिंग स्टाइल शीट है। इसका उपयोग html डॉक्यूमेंट के साथ ही किया जाता है। हम ये भी मान सकते है। की html डॉक्यूमेंट CSS के उपयोग के बिना अधूरी है। html से हम कोई भी टेक्स्ट या इमेज,वीडियो ,आदि। ब्रौज़र में शौ करवा सकते है। लेकिन हर डॉक्यूमेंट को अलग अलग स्टाइल और डॉक्यूमेंट की जगह को निर्धारित करने के लिए हमें CSS यानिकि कास्केडिंग स्टाइल शीट का उपयोग करना आवश्क हो जाता है।

जैसे की आप इंटरनेट में वेबसाइट देखते है। उस सभी में CSS का उपयोग किया गया होता है। हम ऐसा भी मान सकते है। की CSS के बिना यूज किये कोई भी साइट को बनाने से वो वेबसाइट कम दिखाई देगी। और ऐसा प्रतीत होगा की एक वेबपेज में अलग अलग स्थान में कुछ टेक्स्ट लिखे है। जिसके कारण ये समझना भी मुश्किल हो जाता है। की ये वेबसाइट कोनसी इन्फॉर्मेसन या सुविधा प्रदान कर रही है। कुल मिलाकर हम यह कह सकते है। की वो वेबसाइट एक यूजर फ्रेंडली बिलकुल भी नहीं हो सकती है। जैसा की हम और जानते है।

की एक वेबसाइट का यूजर फ्रेंडली कितना आवश्क होता है। अगर यूजर को परेशानी होती है। वेबसाइट को समझने में तो वह वेबसाइट किसी को पसंद नहीं आती है। इस लिए हम हर वेबसाइट में CSS का उपयोग करते है। जो अनिवार्य हो जाती है।

CSS के कितने प्रकार होते है।

हम आपको जानकारी देना चाहेंगे की css यानिकि कास्केडिंग स्टाइल शीट को हम तीन प्रकार के लिख सकते है। (1)Inline (2)Internal (3) External

Inline CSS

Inline CSS इसका उपयोग आप html डॉक्यूमेंट के अंदर ही कर सकते है। जैसे की आप कोई एक पेराग्राफ लिख रहे है। तो आपको ब्रौज़र डिफाइन करना होता है। यह एक पेराग्राफ है। इसके लिए आप कुछ<p>टेक्स्ट </p> इस प्रकार p टैग का उपयोग करते है।

तो अगर आप चाहते है। की किसी पेराग्राफ को एक निश्चित कलर दिया जाये तो आप Inline CSS का उपयोग कर सकते है। इसके लिए आपको कुछ इस प्रकार लिखना होगा। <p style= “color:red “>टेक्स्ट </p> इस प्रकार लिखने से जो भी टेक्स्ट इस पेराग्राफ टैग के मध्य होगा उसका कलर रेड यानिकि लाल हो जायेगा। जैसा की आप इस इमेज में देख सकते है।

Html In Hindi complete information, html in hidi- what is html in hindi- html kya hai in hindi- html in hindi language- html all tags in hindi- introduction to html in hindi

 

जैसा की हमने कलर के आगे रेड लिखा है। तो ये लाल रंग में परिवर्तित हो जायेगा। ऐसी प्रकार अगर आप कोई अन्य कलर नाम या हेक्सकोड का उपयोग करते है। तो वह टेक्स्ट उसी कलर में परिवर्तित हो जायेगा। जो कलर नाम या हेक्सकोडे आप डालते है।

Internal CSS

Internal CSS यह भी एक आसान तरीका है। CSS को लिखने के लिए। जैसा की हमने इनलाइन CSS में देखा की हम किस प्रकार html टैग के साथ css को जोड़ सकते है। उसी प्रकार यह भी html doc फाइल में CSS को जोड़ता है। इसके लिए भी हमे कोई अन्य फाइल बनाने की आवश्कता नहीं रहती है। तो चलिए जानते है।

की हम किस प्रकार Internal CSS जोड़ सकते है। हम आपको जानकरी देते है। की इसे जोड़ने के लिए हमें किसी एलिमेंट id में कोई बदलाव करने की आवश्कता नहीं है। हमे html doc फाइल में head टैग में जाना होता है। और कुछ इस प्रकार CSS कोड लिखना होगा।

<!DOCTYPE html>
<html>
<head>
<style>
body{ background-color: blue;
     }
h1{ color: white;}
p{ color: black;}
</style>
</head>
<body>
<h1>this is main heading </h1>
<p>this is sort peragraf</p>
</body>
</html>

कोड लिखने से पहले आपको कुछ <style></style>इस प्रकार टैग लगाकर ब्रौज़र को बताना होता है। की इस टैग के मध्य लिखा जाने वाला कोड एक css कोड है। और जिस प्रकार आप निर्देश देंगे। उसी प्रकार ब्रौज़र उस कोड को लागु करता है। जैसा की हमने बॉडी, h1, व p का निर्देश दिया है। तो बॉडी, h1, व p का कलर चेंज हो जायेगा।जैसा की आप देख सकते है। की हमने html में head टैग के मध्य कुछ css का उपयोग किया है। चलिए थोड़ा विस्तार से जानते है। सबसे पहले हमने head टैग खोजा जो इस प्रकार <head></head>लिखा होता है। फिर हमने इसमें हमने वेबपेज की बॉडी, h1, व p यानिकि पेराग्राफ का कलर चेंज करने के लिए कॉड लिखा है।

जिसमे बॉडी का कलर ब्लू हो जायेगा। h1 यानिकि मुख्य हेडिंग का कलर सफेद और p यानिकि पेराग्राफ का कलर काला हो जायेगा। इसी प्रकार सबसे पहले आपको उस कोड का टैग लिखना होता है। जिस पर आप कोई भी CSS लागु करना चाहते है। जैसे body, h1, p हमारे टैग है। उसके बाद आपको { }इस प्रकार से सेमीकॉलन लगाना होता है। और फिर इस सेमीकॉलन के मध्य आप CSS कोड लिख सकते है। और लिखा गया कोड काम करने लगेगा।जैसा की आप इस इमेज में देख सकते है।

Html In Hindi complete information, html in hidi- what is html in hindi- html kya hai in hindi- html in hindi language- html all tags in hindi- introduction to html in hindi

External CSS 

External CSS का उपयोग हम उस स्थिति में करते है। जब हमारी वेबसाइट के लिए हमें एक बड़ी CSS फाइल का यूज़ करना पड़ता है। ताकि हमारी html फाइल अधिक बड़ी न हो। तब हम एक नयी फाइल का निर्माण करते है।

style.css के नाम से और उस फाइल को लिंक टैग के माध्यम से हेड टैग में जोड़ते है। जैसा की आप देख सकते है। की लिंक टैग की मदद से कैसे CSS फाइल को html फाइल के साथ जोड़ा जाता है।

<!DOCTYPE html>

<html>

<head>

<link rel="stylesheet" type="text/css" href="style.css">

<title> External CSS METHOD</title>

</head>

<body>

<h2> HEADING  </h2> 

<p> Paragraph </p>

</body>

</html>

href के आगे आपको उस फोल्डर नाम .CSS के साथ जोड़ना है। जिसमे आपकी CSS फ़ाइल रखी हुई है। आशा करता हु की आपको अनुमानित सभी जानकारी मिल चुकी है। html के बारे में अगर आप के मन में अभी भी कोई सवाल है। तो आप हमे कमेंट में पूछ सकते है।

हम आपके सवाल का जवाब देने की पूरी कोशिश करेंगे। अगर आपको जानकारी अछि लगी हो तो अपना सुझाव कमेंट बॉक्स में दे सकते है। भविष्य में भी हम यही कोशिश करेंगे की आपको सही जानकारी बहुत ही सरल भाषा में बता पाए। ताकि आपको आसानी से समझ आप सके। धन्यवाद।

read more

how to create table in html in hindi

▷Blogger Me Share Button Kaise Lagaye

Click to comment

Leave a Reply

tranding