label標(biāo)簽:

1.label標(biāo)簽的作用

首先我們看一組代碼：

性別:男<input type="radio" value="男" name="gender"> 女<input type="radio" value="女" name="gender">

這是我們昨天寫的代碼，運(yùn)行結(jié)果：

然后我們?cè)偌由蟣abel標(biāo)簽：

性別:<input type="radio" value="男" name="gender" id="nan"> <label for="nan">男</label><input type="radio" value="女" name="gender" id="nv"> <label for="nv">女</label>

這是我們改進(jìn)之后的代碼，運(yùn)行結(jié)果：

**欸~，這不是沒區(qū)別嗎？**別著急，仔細(xì)看一下，我們就會(huì)發(fā)現(xiàn)在加入label標(biāo)簽之前，我們的運(yùn)行結(jié)果中鼠標(biāo)點(diǎn)在這個(gè)"男"或者"女"的漢字上是沒有效果的。但是加入label標(biāo)簽之后，我們點(diǎn)擊了漢字之后效果和點(diǎn)到了按鈕鍵是一樣的。

同樣的，其他type屬性也可以：

<label for="username">用戶名:</label> <input type="text" id="username" name="username" placeholder="請(qǐng)輸入用戶名"><br> <label for="password">密碼:</label> &nbsp;&nbsp;&nbsp;<input type="password" id="password" name="password" placeholder="請(qǐng)輸入密碼">

運(yùn)行結(jié)果：

可以看到，我們的代碼讓用戶的體驗(yàn)變得更好了！

2.label標(biāo)簽的語(yǔ)法：

性別: <label for="nan">男</label> <!--這里的label里面的for屬性規(guī)定了一個(gè)值--> <!--label標(biāo)簽是個(gè)雙標(biāo)簽，雙標(biāo)簽中間的值就是可以用來(lái)代替按鈕的文本--> <input type="radio" value="男" name="gender" id="nan"> <!--將上面的for屬性規(guī)定的值添加到這里的id屬性中就大功告成了！--> <label for="nv">女</label> <input type="radio" value="女" name="gender" id="nv">

如果有什么問(wèn)題，歡迎評(píng)論區(qū)探討呀！

總結(jié)

以上是生活随笔為你收集整理的表单中的label标签的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。