COPA

HTML Practical Code Using Form Elements

HTML Practical | HTML Form Elements

HTML प्रेक्टिकल - एचटीएमएल फॉर्म एलीमेंट का प्रयोग
HTML Practical - Using HTML Form Elements


HTML Form Elements Practical Learning

वेब डिजाईन विद एचटीएमएल प्रेक्टिकल - एचटीएमएल फॉर्म एलीमेंट का प्रयोग
Web Design with HTML Practical - Using Form Elements

एचटीएमएल फॉर्म का प्रयोग यूजर द्वारा दिए जाने वाले इनपुट के लिए किया जाता है। एचटीएमएल फॉर्म के द्वारा विभिन्न जानकारी जैसे नाम, ईमेल आई डी, एड्रैस, फोन नंबर, पासवर्ड आदि की जानकारी विभिन्न फॉर्म एलीमेंट जैसे इनपुट टेक्स्ट, टेक्स्ट फील्ड, चेकबॉक्स, रेडियो बटन, सबमिट बटन आदि के द्वारा प्राप्त की जा सकती है। एचटीएमएल फॉर्म द्वारा यह सभी जानकारियाँ आसानी से प्राप्त की जा सकती हैं।
HTML मे फॉर्म (Form) को <form> ........... </form> टैग से डिफाइन करते है।
HTML फॉर्म को विभिन्न प्रकार के यूजर से डाटा को इकट्ठा करने के लिए प्रयोग किया जाता है जैसे : Name, Email Address, Phone Numbers की जानकारी आदि।
एचटीएमएल में प्रयोग की जाने वाले विभिन्न फॉर्म एलीमेंट निम्न हैं:



Requirements : (Tools / Equipments / Instruments)


पर्सनल कंप्यूटर / माइक्रोसॉफ्ट विंडोज / नोटपैड / वेब ब्राउज़र

एचटीएमएल फॉर्म एलीमेंट का प्रयोग | Using Form Elements in HTML


HTML में फॉर्म का प्रयोग करने के लिए निम्नानुसार स्टेप्स प्रयोग कीजिए।

विंडोज के नोटेपेड प्रोग्राम को ओपन कीजिए
START > ALL PROGRAMS > ACCESSORIES >   NOTEPAD


नोटपैड में निम्नानुसार कोड टाइप कीजिए।



फाइल को सेव कीजिए।  HTML File  को सेव करने के लिए   की-बोर्ड से  Ctrl + S  दबाएं।   SaveAs  डायलॉग बॉक्स में फाईल के    नाम के साथ एक्सटेंशन के रूप में HTML अवश्य लिखें. जैसे  form.html  और  Save as type :  आप्शन पर निम्नानुसार All Files सेलेक्ट कर  Save  बटन पर क्लिक कीजिए।

फाईल को खोलने के लिए माऊस से डबल क्लिक कीजिए। आपकी फाईल आपके डिफ़ॉल्ट ब्राउज़र में ओपन हो जाएगी। यह इस प्रकार दिखाई देगी।



एचटीएमएल ऑनलाइन प्रेक्टिस – एचटीएमएल फॉर्म इनपुट एलीमेंट का प्रयोग
Online HTML Practice - Using Input Element in HTML Form Program Code


HTML प्रोग्राम की ऑनलाइन प्रैक्टिस नीचे दिए गए कोड विंडो में एचटीएमएल फॉर्म इनपुट एलीमेंट का प्रोग्राम कोड लिख कर फॉर्म बना सकते हैं। प्रोग्राम कोड का आउटपुट, रिजल्ट विंडो में प्रदर्शित होगा।



See the Pen HTML Form - Using Text Field, Password Field, Radio Button by ITI COPA (@copaguide) on CodePen.



 ➥  <input> एलीमेंट का प्रयोग कर एचटीएमएल में स्कूल एडमिशन फॉर्म का कोड लिखकर आउटपुट रिजल्ट विंडो में चेक कीजिए।

एचटीएमएल ऑनलाइन प्रेक्टिस – एचटीएमएल फॉर्म लेबल एलीमेंट का प्रयोग
Online HTML Practice - Using Label Element in HTML Form Program Code


See the Pen HTML Form Input Element with Type Attribute by ITI COPA (@copaguide) on CodePen.



एचटीएमएल ऑनलाइन प्रेक्टिस – एचटीएमएल फॉर्म सिलेक्ट एलीमेंट का प्रयोग
Online HTML Practice - Using Select Element in HTML Form Program Code


HTML फॉर्म में ड्रॉप डाउन लिस्ट के लिए <select> एलीमेंट का प्रयोग किया जाता है। select फ़ॉर्म एलीमेंट्स के option एट्रीब्यूट के द्वारा सिलेक्शन लिस्ट की वैल्यू को डिफाइन किया जाता है।

See the Pen HTML Form Select Element with Option Tag by ITI COPA (@copaguide) on CodePen.



एचटीएमएल ऑनलाइन प्रेक्टिस – एचटीएमएल फॉर्म फील्ड सेट एवं लेजेंड एलीमेंट का प्रयोग
Online HTML Practice - Using Fieldset & Legend Element in HTML Form Program Code


HTML फॉर्म में फील्डसेट <fieldset> एलिमेंट फॉर्म में एक ही प्रकार के डाटा की ग्रुपिंग के लिए उपयोग किया जाता है। जैसे रेजिस्ट्रैशन फॉर्म में पर्सनल इनफार्मेशन, क्वालिफिकेशन, आदि को अलग अलग ग्रुप में बांटना है तो fieldset एलीमेंट का प्रयोग करते हैं। इसी प्रकार <legend> का प्रयोग इसके कैप्शन के लिए किया जाता है।

See the Pen Field Set and Legend in HTML Form by ITI COPA (@copaguide) on CodePen.





Computer Hindi Notes | Learning HTML Programming | Learn HTML Form Elements








Computer Hindi Notes | Web Page Design with HTML


HTML Hindi Notes for ITI-COPA, CCC, DCA, PGDCA
copaguide.com



Web Page Design HTML | Practical Exercise


Web Page Design Using HTML Practical
copaguide.com



Online MCQ Test Series | Internet & HTML


Web Page Design Using HTML MCQ
copaguide.com



Tags - What is HTML forms Practical Program Code Explanation. Learn to Use forms elements Tag Practice Online. Practical Use of forms in HTML. Using forms elements Text box, Check box, Radio button, Combo Box, Text Field in HTML. Using form Elements in HTML Programming. HTML Hindi Notes Using forms. How to use forms elements in HTML. HTML forms Tags Practical Example. HTML form element program code. HTML Programming Creating forms with Text box, Check box, Radio button, Combo Box, Text Field Exercise, How to Create forms in HTML. HTML Hindi Notes। How to Create forms in HTML | In Hindi How to Create forms in HTML. HTML Tutorial in Hindi HTML tutorial for beginners in Hindi.
HTML फॉर्म क्या हैं? एचटीएमएल में फॉर्म का कैसे प्रयोग करें? एचटीएमएल में फॉर्म टैग्स एवं उनके उपयोग। फॉर्म एलीमेंट प्रैक्टिकल उदाहरण सहित। एचटीएमएल फॉर्म टैग की जानकारी, एचटीएमएल प्रोग्रामिंग फॉर्म एलीमेंट के उदाहरण सहित प्रोग्रामिंग कोड, HTML फॉर्म एलीमेंट टैग का परिचय, HTML फॉर्म एलीमेंट बनाने के लिए Use होने वाले HTML Elements, HTML फॉर्म एलीमेंट ऐट्ट्रीब्यूट के प्रकार, HTML में फॉर्म एलीमेंट क्या है? HTML पेज में फॉर्म एलीमेंट बनाने के लिए फॉर्म स्ट्रक्चर कौन सा है? वेब पेज पर फॉर्म बनाने के लिए HTML में सिंटैक्स क्या है? HTML में फॉर्म एलीमेंट का प्रयोग कैसे करें? फॉर्म एलीमेंट उदाहरण सहित समझाइए? फॉर्म कैसे क्रिएट करें.फॉर्म एलीमेंट क्या होते है? विभिन्न फॉर्म एलीमेंट जैसे टेक्स्ट बॉक्स, चेक बॉक्स, रेडियो बटन, ड्रॉप डाउन लिस्ट, पैराग्राफ की जानकारी दीजिए।