定义和用法
for 属性规定 label 与哪个表单元素绑定。
隐式和显式的联系
标记通常以下面两种方式中的一种来和表单控件相联系：将表单控件作为标记标签的内容，这样的就是隐式形式，或者为 <label> 标签下的 for 属性命名一个目标表单 id，这样就是显式形式。
例如，在 XHTML 中：
显式的联系：<label for="SSN">Social Security Number:</label><input type="text" name="SocSecNum"id="SSN"/> 隐式的联系：<label>Date of Birth: <input type="text" name="DofB" /></label>
第一个标记是以显式形式将文本 "Social Security Number:" 和表单的社会安全号码的文本输入控件 ("SocSecNum") 联系起来，它的 for 属性的值和控件的 id 一样，都是 SSN。第二个标记 ("Date of Birth:") 不需要 for 属性，它的相关控件也不需要 id 属性，它们是通过在 <label> 标签中放入 <input> 标签来隐式地连接起来的。
最常见的checkbox的使用：
<input type="checkbox" name="test" /> 点击这里没有任何效果
运行代码 复制代码 另存代码 提示：您可以先修改部分代码再运行
因为checkbox在高分辨率下，小方块会很小，很不容易点，这难免在用户体验上大打折扣。
下面看看我们的解决方法：
1、给checkbox配个“老婆”（老婆的特点：必要的）：
<input type="checkbox" id="test" name="test" /><label for="test">点击这里就可以选中label</label>
运行代码 复制代码 另存代码 提示：您可以先修改部分代码再运行
for属性功能：表示lable标签要绑定的HTML元素，点击这个标签的时候，所绑定的元素将获取焦点。
补充： 除以上方法，还可以直接用 label 套嵌整个表单组件和文本标签，如：
<label><input type="checkbox" />点击这里就可以选中label</label>
运行代码 复制代码 另存代码 提示：您可以先修改部分代码再运行
根据规范这样文本会自动与邻接的表单组件关联，但遗憾的是 IE 并不支持这个特性。
2、给checkbox配个“小蜜”（小蜜的特点：更周到）：
<input type="checkbox" id="test" name="test" /><label for="test" style="cursor:pointer">鼠标移到此处提示可点击，点击可选中label</label>
运行代码 复制代码 另存代码 提示：您可以先修改部分代码再运行
想起《大话西游里》唐僧的唠叨：“你想要啊？你要是想要的话你就说话嘛，你不说我怎么知道你想要呢，虽然你很有诚意地看着我，可是你还是要跟我说你想要的。你真的想要吗？那就拿去吧！你不是真的想要吧？难道你真的想要吗？…………”
这话说出了用户体验的精华，你不告诉用户，用户怎么知道这里能点击。所有我们需要给label加个属性（cursor:pointer）来告诉用户这里可以点击。
3、给checkbox再配个“情人”（情人的特点：可取代性）：
<input type="checkbox" id="test" name="test" /><label for="test" style="cursor:pointer" accesskey="1">鼠标移到此处提示可点击，点击可选中label，你也可以用键盘快捷方式来<span style="text-decoration:underline;">1</span>（Alt+1）来选择checkbox</label>
运行代码 复制代码 另存代码 提示：您可以先修改部分代码再运行
网站要兼顾更多类型的用户使用，比如某些从不使用鼠标，只使用键盘操作的用户，点击对于它们来说，已经没有任何意义，那我们该怎么做呢，最好的方法就是使用label的accesskey属性。
accesske属性功能：表示访问lable标签所绑定的元素的热键，当您按下热键，所绑定的元素将获取焦点。
注意：accessKey属性所设置的快捷键不能与浏览器的快捷键冲突，否则将优先激活浏览器的快捷键。