使用label使checkbox、radio更加友好

使用label标签可以将我们的文本与html元素关联,点击文本的时候实现checkbox与radio的选择

label for checkbox
<hr/>
<input id="a1" type="checkbox" name="a" value="1" /><label for="a1">.NET Framework 2.0</label><br/>
<input id="a2" type="checkbox" name="a" value="2" /><label for="a2">其他.NET2.0文章</label><br/>
<input id="a3" type="checkbox" name="a" value="3" /><label for="a3">Compact Framework 2.0</label><br/>
<input id="a4" type="checkbox" name="a" value="4" /><label for="a4">取消选择</label> checkbox效果.<br/>
<br/><br/>
label for radio
<hr/>
<input id="b1" type="radio" name="b" value="5" /><label for="b1">.NET Framework 2.0</label><br/>
<input id="b2" type="radio" name="b" value="6" /><label for="b2">其他.NET2.0文章</label><br/>
<input id="b3" type="radio" name="b" value="7" /><label for="b3">Compact Framework 2.0</label><br/>
<input id="b4" type="radio" name="b" value="8" /><label for="b4">取消选择</label> checkbox效果.<br/>
<br/><br/>
简单说明一下:
label 中的 for = ID(这里对应的是html元素的ID值,所以ID值在页面中必须是唯一的)
所以对于checkbox或者radio,name值是一样的,但是id值是唯一。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值