यह आलेख व्यावहारिक उदाहरण की सहायता से HTML रेडियो बटन बनाने में आपका मार्गदर्शन करेगा।
HTML में Radio Button कैसे Add करें?
HTML में एक रेडियो बटन जोड़ने के लिए, नीचे दिए गए सिंटैक्स का पालन करें:
< इनपुट प्रकार = 'रेडियो' नाम = '' मूल्य = '' >
यहाँ बताए गए सिंटैक्स का विवरण दिया गया है:
- ' प्रकार ”: यह विशेषता निर्दिष्ट करती है कि आप किस प्रकार का इनपुट बनाना चाहते हैं जैसे टेक्स्ट, रेडियो, चेकबॉक्स और बहुत कुछ। एक रेडियो बटन बनाने के लिए, विशेषता मान को 'रेडियो' के रूप में सेट किया जाना चाहिए।
- ' नाम ”: यह इनपुट तत्व के नाम को परिभाषित करता है। यह विशेषता रेडियो बटनों की सूची के लिए समान होनी चाहिए।
- ' मूल्य ”: यह उस मान को निर्दिष्ट करता है जो रेडियो बटन को चेक के रूप में चिह्नित किए जाने पर सर्वर को भेजा जाएगा।
उदाहरण: HTML में Radio Button Add करना
यह उदाहरण इनपुट रेडियो बटन का उपयोग करके HTML में एक रेडियो बटन जोड़ने की प्रक्रिया पर चर्चा करेगा। में
चरण 1: HTML फ़ाइल बनाना
सबसे पहले, HTML फ़ाइल में एक
निर्मित
- सबसे पहले, 'जोड़ें' <एच1> ” पेज को हेडिंग देने के लिए टैग करें।
- फिर एक ' ” एक पैराग्राफ या टेक्स्ट लाइन के लिए टैग करें।
- उसके बाद, एक विशेषता के साथ इनपुट टैग जोड़ा जाता है ' प्रकार “मूल्य होना” रेडियो ', नाम चयन के रूप में सेट है, और' मूल्य ' जैसा ' लाल ”। समान नाम वाले प्रत्येक रेडियो बटन को अलग-अलग मान दिए गए हैं। समान नाम समान समूह या सूची का प्रतिनिधित्व करता है।
- यदि आप एक बटन जोड़ना चाहते हैं जो डिफ़ॉल्ट रूप से चेक किए गए के रूप में चिह्नित है, तो विशेषता असाइन करें ' जाँच ” उस बटन के लिए।
- अंत में, ' <लेबल> प्रत्येक रेडियो बटन पर तत्व का उपयोग कैप्शन जोड़ने के लिए किया जाता है। यह बेहतर पहुंच भी प्रदान करता है।
नीचे दिया गया कोड उपरोक्त परिदृश्य की व्याख्या है:
< एच 1 > एचटीएमएल रेडियो बटन एच 1 >< पी > आपका पसंदीदा रंग कौन सा है? पी >
< इनपुट प्रकार = 'रेडियो' नाम = 'रंग चुनो' मूल्य = 'लाल' जाँच >
< लेबल के लिये = 'रेडियो1' > लाल लेबल >
< बीआर >
< इनपुट प्रकार = 'रेडियो' नाम = 'रंग चुनो' मूल्य = 'नीला' >
< लेबल के लिये = 'रेडियो1' > नीला लेबल >
< बीआर >
< इनपुट प्रकार = 'रेडियो' नाम = 'रंग चुनो' मूल्य = 'हरा' >
< लेबल के लिये = 'रेडियो1' > हरा लेबल >
< बीआर >
< इनपुट प्रकार = 'रेडियो' नाम = 'रंग चुनो' मूल्य = 'बैंगनी' >
< लेबल के लिये = 'रेडियो1' > बैंगनी लेबल >
< बीआर >
< इनपुट प्रकार = 'रेडियो' नाम = 'रंग चुनो' मूल्य = 'अन्य' >
< लेबल के लिये = 'रेडियो1' > अन्य लेबल >
यह देखा जा सकता है कि रेडियो बटन सफलतापूर्वक बनाए गए हैं:
आप नीचे दिए गए सीएसएस कोड का पालन करके ऊपर बनाए गए रेडियो बटन पर स्टाइल भी लागू कर सकते हैं।
चरण 2: HTML में स्टाइल लागू करना
' डिव ” HTML फ़ाइल में हमारे द्वारा बनाए गए div टैग को इंगित करता है:
- पहले ' पीछे का रंग 'संपत्ति' के रूप में सेट है #8197f0 ”।
- ' सीमा 'संपत्ति' के रूप में सेट है 5px डॉटेड #13023a ”, जहां 5px बॉर्डर की चौड़ाई का प्रतिनिधित्व करता है, बिंदीदार रेखा के प्रकार को इंगित करता है, और अगला बॉर्डर के रंग को इंगित करता है।
- ' गद्दी '' के रूप में सेट किया गया है 20 पीएक्स 100 पीएक्स ” जहां 20px ऊपर और नीचे से पैडिंग निर्दिष्ट करता है और 100px बाएं और दाएं से पैडिंग इंगित करता है।
- फॉन्ट स्टाइलिंग के लिए, असाइन करें ' फ़ॉन्ट परिवार 'संपत्ति मूल्य' के रूप में घसीट ”।
सीएसएस
डिव {पीछे का रंग: #8197f0;
सीमा: 5px बिंदीदार #13023a;
गद्दी: 20px 100px;
फ़ॉन्ट-आकार: 20 पीएक्स;
फ़ॉन्ट-परिवार: कर्सिव;
}
यह देखा जा सकता है कि div तत्व को सफलतापूर्वक स्टाइल किया गया है:
इतना ही! हमने HTML Radio Button के बारे में विस्तार से बताया है.
निष्कर्ष
एक रेडियो बटन एक इनपुट है जो हमेशा दो या दो से अधिक विकल्पों के समूह में दिखाई देता है। इस समूह से, उपयोगकर्ता केवल एक विकल्प चुन सकता है। HTML में, “का उपयोग करके एक रेडियो बटन बनाया जा सकता है। <इनपुट> 'मान के साथ विशेषता प्रकार वाले टैग' रेडियो ”। इस ब्लॉग ने HTML में रेडियो बटन जोड़ने की विधि का प्रदर्शन किया।