小伙伴們,你們?cè)谇懊鎸W(xué)習(xí)表單各種控件的時(shí)候,有沒(méi)有發(fā)現(xiàn)一個(gè)標(biāo)簽--label,這一小節(jié)就來(lái)揭曉它的作用。
label標(biāo)簽不會(huì)向用戶呈現(xiàn)任何特殊效果,它的作用是為鼠標(biāo)用戶改進(jìn)了可用性。如果你在 label 標(biāo)簽內(nèi)點(diǎn)擊文本,就會(huì)觸發(fā)此控件。就是說(shuō),當(dāng)用戶單擊選中該label標(biāo)簽時(shí),瀏覽器就會(huì)自動(dòng)將焦點(diǎn)轉(zhuǎn)到和標(biāo)簽相關(guān)的表單控件上(就自動(dòng)選中和該label標(biāo)簽相關(guān)連的表單控件上)。
語(yǔ)法:
<label for="控件id名稱">
注意:標(biāo)簽的 for 屬性中的值應(yīng)當(dāng)與相關(guān)控件的 id 屬性值一定要相同。
例子:
<form <label for="email">輸入你的郵箱地址</label> <input type="email" id="email" placeholder="Enter email"> </form>
我來(lái)試試:完成下面任務(wù)
要求:用戶名,密碼用for屬性關(guān)聯(lián)。效果圖如下:

備注:這一小節(jié)沒(méi)有正確性驗(yàn)證,請(qǐng)查看結(jié)果窗口與任務(wù)所給的結(jié)果圖片是否一致,從而判斷輸入代碼是否正確。
參考代碼如下:
<label for="uname">輸入你的用戶名</label> <input type="text" id="uname" placeholder="Enter uname"> <br> <label for="pass">輸入你的密碼</label> <input type="password" id="pass" placeholder="Enter password">
請(qǐng)驗(yàn)證,完成請(qǐng)求
由于請(qǐng)求次數(shù)過(guò)多,請(qǐng)先驗(yàn)證,完成再次請(qǐng)求
打開(kāi)微信掃碼自動(dòng)綁定
綁定后可得到
使用 Ctrl+D 可將課程添加到書(shū)簽
舉報(bào)