label标签的可访问性问题
label标签可以优雅地扩大表单控件元素的点击区域。例如，单纯的单选框点击区域就鼻屎那么大的地方，经常会点不到位置。因此，label标签的使用对于提高页面的可用性可访问性是很有帮助的。
其实，它的样子就是
网易云课堂就是这么做的
还有其他的网站（盗图的，哈哈）
我们一般有两种方法来优雅地扩展表单控件的点击区域。
- 其一是使用label标签包裹控件元素
- 另外的方法就是使用label标签的for属性与控件元素的id相关联。
这就意味着，我们可以有如下些做法：
- 使用for和id关联控件
<p>
<label for="test">标签</label>
<input name="input" type="text" id="test" />
</p>
- label标签包裹控件
<p>
<label>标签 <input name="input" type="text" /></label>
</p>
- 双管齐下
<p>
<label for="test2">标签 <input name="input" type="text" id="test2" /></label>
</p>
基本上，在大部分浏览器下（IE6下label标签包裹控件的方法是不顶用的），三个方法都是可以扩大单行文本框控件的点击区域的（点击“标签”二字，文本框即focus）。
使用for和id找到控件元素的方法要比将控标件放在label签内的健壮性好很多。建议使用for + id方法，而不要因为懒得蛋疼乳酸，直接把控件元素套在label标签之下。也不要使用看上去更保险的“双管齐下”的方法。
整片博客内容是从 张鑫旭大神那里借鉴来的，—>_—>
