`
royzhou1985
  • 浏览: 250567 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

使用label使checkbox、radio更加友好

    博客分类:
  • HTML
阅读更多
使用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值是唯一。


分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics