ఆచరణాత్మక ఉదాహరణ సహాయంతో HTML రేడియో బటన్‌ను రూపొందించడంలో ఈ కథనం మీకు మార్గనిర్దేశం చేస్తుంది.
HTMLలో రేడియో బటన్‌ను ఎలా జోడించాలి?
HTMLలో రేడియో బటన్‌ను జోడించడానికి, దిగువ ఇచ్చిన సింటాక్స్‌ని అనుసరించండి:
< ఇన్పుట్ రకం = 'రేడియో' పేరు = '' విలువ = '' >
పేర్కొన్న వాక్యనిర్మాణం యొక్క వివరణ ఇక్కడ ఉంది:
- ' రకం ”: ఈ లక్షణం మీరు టెక్స్ట్, రేడియో, చెక్‌బాక్స్ మరియు మరిన్నింటిని సృష్టించాలనుకుంటున్న ఇన్పుట్ రకాన్ని నిర్దేశిస్తుంది. రేడియో బటన్‌ను సృష్టించడానికి, అట్రిబ్యూట్ విలువ తప్పనిసరిగా “రేడియో”గా సెట్ చేయబడాలి.
- ' పేరు ”: ఇది ఇన్పుట్ మూలకం పేరును నిర్వచిస్తుంది. రేడియో బటన్‌ల జాబితాకు ఈ లక్షణం ఒకే విధంగా ఉండాలి.
- ' విలువ ”: ఇది రేడియో బటన్‌ను తనిఖీ చేసినట్లుగా గుర్తించబడినప్పుడు సర్వర్‌కు పంపబడే విలువను నిర్దేశిస్తుంది.
ఉదాహరణ: HTMLలో రేడియో బటన్‌ని జోడించడం
ఈ ఉదాహరణ ఇన్పుట్ రేడియో బటన్‌ను ఉపయోగించి HTMLలో రేడియో బటన్‌ను జోడించే విధానాన్ని చర్చిస్తుంది. లో
దశ 1: HTML ఫైల్‌ని సృష్టిస్తోంది
ముందుగా, HTML ఫైల్‌లో
సృష్టించిన
- మొదట, 'ని జోడించండి పేజీకి హెడ్డింగ్ ఇవ్వడానికి ” ట్యాగ్ చేయండి.
- అప్పుడు, ఒక ' ” పేరా లేదా టెక్స్ట్ లైన్ కోసం ట్యాగ్.
- ఆ తర్వాత, ఇన్పుట్ ట్యాగ్ ఒక లక్షణంతో జోడించబడుతుంది “ రకం 'విలువ కలిగి' రేడియో ”, పేరు ఎంపికగా సెట్ చేయబడింది మరియు “ విలువ 'వలే' ఎరుపు ”. ఒకే పేరు ఉన్న ప్రతి రేడియో బటన్‌కు వేర్వేరు విలువలు ఇవ్వబడ్డాయి. అదే పేరు ఒకే సమూహం లేదా జాబితాను సూచిస్తుంది.
- మీరు డిఫాల్ట్‌గా చెక్ చేయబడినట్లుగా గుర్తు పెట్టబడిన బటన్‌ను జోడించాలనుకుంటే, ఆపై “లక్షణాన్ని కేటాయించండి తనిఖీ చేశారు ” ఆ బటన్‌కి.
- చివరగా, ' <లేబుల్> ” ప్రతి రేడియో బటన్‌లోని మూలకం శీర్షికలను జోడించడానికి ఉపయోగించబడుతుంది. ఇది మెరుగైన ప్రాప్యతను కూడా అందిస్తుంది.
దిగువ కోడ్ పైన పేర్కొన్న దృశ్యం యొక్క వివరణ:
< h1 > HTML రేడియో బటన్ h1 >< p > మీకు ఇష్టమైన రంగు ఏది? p >
< ఇన్పుట్ రకం = 'రేడియో' పేరు = 'ఎంపిక రంగు' విలువ = 'ఎరుపు' తనిఖీ చేశారు >
< లేబుల్ కోసం = 'రేడియో1' > ఎరుపు లేబుల్ >
< br >
< ఇన్పుట్ రకం = 'రేడియో' పేరు = 'ఎంపిక రంగు' విలువ = 'నీలం' >
< లేబుల్ కోసం = 'రేడియో1' > నీలం లేబుల్ >
< br >
< ఇన్పుట్ రకం = 'రేడియో' పేరు = 'ఎంపిక రంగు' విలువ = 'ఆకుపచ్చ' >
< లేబుల్ కోసం = 'రేడియో1' > ఆకుపచ్చ లేబుల్ >
< br >
< ఇన్పుట్ రకం = 'రేడియో' పేరు = 'ఎంపిక రంగు' విలువ = 'ఊదా' >
< లేబుల్ కోసం = 'రేడియో1' > ఊదా లేబుల్ >
< br >
< ఇన్పుట్ రకం = 'రేడియో' పేరు = 'ఎంపిక రంగు' విలువ = 'ఇతరులు' >
< లేబుల్ కోసం = 'రేడియో1' > ఇతరులు లేబుల్ >
రేడియో బటన్లు విజయవంతంగా సృష్టించబడినట్లు చూడవచ్చు:
దిగువ పేర్కొన్న CSS కోడ్‌ని అనుసరించడం ద్వారా మీరు పైన సృష్టించిన రేడియో బటన్‌కు శైలులను కూడా వర్తింపజేయవచ్చు.
దశ 2: HTMLకి శైలిని వర్తింపజేయడం
ది ' div ” మేము HTML ఫైల్‌లో సృష్టించిన div ట్యాగ్‌ని సూచిస్తుంది:
- మొదట, ' నేపథ్య రంగు 'ఆస్తి' గా సెట్ చేయబడింది #8197f0 ”.
- ' సరిహద్దు 'ఆస్తి' గా సెట్ చేయబడింది 5px చుక్కలు #13023a ”, ఇక్కడ 5px సరిహద్దు యొక్క వెడల్పును సూచిస్తుంది, చుక్కలు పంక్తి రకాన్ని సూచిస్తుంది మరియు తదుపరి అంచు యొక్క రంగును సూచిస్తుంది.
- ' పాడింగ్ ” గా సెట్ చేయబడింది 20px 100px ” ఇక్కడ 20px ఎగువ మరియు దిగువ నుండి పాడింగ్‌ను నిర్దేశిస్తుంది మరియు 100px ఎడమ మరియు కుడి నుండి పాడింగ్‌ను సూచిస్తుంది.
- ఫాంట్ స్టైలింగ్ కోసం, 'ని కేటాయించండి ఫాంట్ కుటుంబం 'ఆస్తి విలువ' కర్సివ్ ”.
CSS
div {నేపథ్య రంగు: #8197f0;
అంచు: 5px చుక్కలు #13023a;
పాడింగ్: 20px 100px;
ఫాంట్ పరిమాణం: 20px;
ఫాంట్-కుటుంబం: కర్సివ్;
}
div మూలకం విజయవంతంగా స్టైల్ చేయబడిందని చూడవచ్చు:
అంతే! మేము HTML రేడియో బటన్ గురించి వివరంగా వివరించాము.
ముగింపు
రేడియో బటన్ అనేది ఎల్లప్పుడూ రెండు లేదా అంతకంటే ఎక్కువ ఎంపికల సమూహాలలో కనిపించే ఇన్పుట్. ఈ సమూహం నుండి, వినియోగదారు ఒక ఎంపికను మాత్రమే ఎంచుకోగలరు. HTMLలో, రేడియో బటన్‌ని ఉపయోగించి సృష్టించవచ్చు <ఇన్పుట్> విలువతో లక్షణ రకాన్ని కలిగి ఉన్న ట్యాగ్ రేడియో ”. ఈ బ్లాగ్ HTMLలో రేడియో బటన్‌లను జోడించే పద్ధతిని ప్రదర్శించింది.