एचटीएमएल <लेबल> टैग
उदाहरण
लेबल के साथ तीन रेडियो बटन:
<form action="/action_page.php">
<input type="radio" id="html" name="fav_language" value="HTML">
<label for="html">HTML</label><br>
<input type="radio" id="css" name="fav_language"
value="CSS">
<label for="css">CSS</label><br>
<input type="radio"
id="javascript" name="fav_language" value="JavaScript">
<label for="javascript">JavaScript</label><br><br>
<input type="submit" value="Submit">
</form>
परिभाषा और उपयोग
<label>टैग कई तत्वों के लिए एक लेबल को परिभाषित करता है :
- <इनपुट प्रकार = "चेकबॉक्स">
- <इनपुट प्रकार = "रंग">
- <इनपुट प्रकार = "दिनांक">
- <इनपुट प्रकार = "डेटाटाइम-लोकल">
- <इनपुट प्रकार = "ईमेल">
- <इनपुट प्रकार = "फ़ाइल">
- <इनपुट प्रकार = "माह">
- <इनपुट प्रकार = "संख्या">
- <इनपुट प्रकार = "पासवर्ड">
- <इनपुट प्रकार = "रेडियो">
- <इनपुट प्रकार = "रेंज">
- <इनपुट प्रकार = "खोज">
- <इनपुट प्रकार = "दूरभाष">
- <इनपुट प्रकार = "पाठ">
- <इनपुट प्रकार = "समय">
- <इनपुट प्रकार = "यूआरएल">
- <इनपुट प्रकार = "सप्ताह">
- <मीटर>
- <प्रगति>
- <चुनें>
- <textarea>
उपरोक्त तत्वों के साथ लेबल के उचित उपयोग से लाभ होगा:
- स्क्रीन रीडर उपयोगकर्ता (जब उपयोगकर्ता तत्व पर ध्यान केंद्रित करता है, तो लेबल को ज़ोर से पढ़ेगा)
- जिन उपयोगकर्ताओं को बहुत छोटे क्षेत्रों (जैसे चेकबॉक्स) पर क्लिक करने में कठिनाई होती है - क्योंकि जब कोई उपयोगकर्ता
<label>तत्व के भीतर टेक्स्ट पर क्लिक करता है, तो यह इनपुट को टॉगल करता है (इससे हिट क्षेत्र बढ़ जाता है)।
टिप्स और नोट्स
युक्ति: की विशेषता के <label>
लिए उन्हें एक साथ बाँधने के लिए संबंधित तत्व की आईडी विशेषता के बराबर होना चाहिए। तत्व को तत्व के अंदर रखकर एक लेबल को एक तत्व के लिए बाध्य किया जा सकता है <label>।
ब्राउज़र समर्थन
| Element | |||||
|---|---|---|---|---|---|
| <label> | Yes | Yes | Yes | Yes | Yes |
गुण
| Attribute | Value | Description |
|---|---|---|
| for | element_id | Specifies the id of the form element the label should be bound to |
| form | form_id | Specifies which form the label belongs to |
वैश्विक गुण
<label>टैग HTML में वैश्विक विशेषताओं का भी समर्थन करता है ।
घटना गुण
<label>टैग HTML में ईवेंट विशेषताओं का भी समर्थन करता है ।
संबंधित पृष्ठ
HTML DOM संदर्भ: लेबल ऑब्जेक्ट
डिफ़ॉल्ट सीएसएस सेटिंग्स
अधिकांश ब्राउज़र <label>निम्न डिफ़ॉल्ट मानों के साथ तत्व प्रदर्शित करेंगे:
उदाहरण
label {
cursor: default;
}