HTML5 Checkbox如何显示文本

Question

我想显示复选框的相关文本。

<input id="Checkbox1" type="checkbox" value="Admin"><span>Admin User</span>

这是最常用的标记。但是对复选框使用单独的跨度感觉不太好。它在形式上看起来甚至都不好看。有没有办法将这两者相互联系起来？或者最好的方法是什么？

Answer 1

使用Label和for属性。

  

for属性指定标签绑定到哪个表单元素

<input id="Checkbox1" name="Checkbox1" type="checkbox" value="Admin" />
<label for="Checkbox1">AdminUser</label>

同时为您的输入name

Answer 2

您可以使用嵌套的for：

，而不是使用<input type="checkbox">属性

<label><input name="Checkbox1" type="checkbox">Admin User</label>

Answer 3

您可以使用<label> - 代码：

，而不是使用<span>

<label for="Checkbox1">Admin User</label>

它会将标签“附加”到您的复选框，因为在单击标签时，就好像用户点击了复选框一样。

对于样式，您需要应用自己的样式，使它们自己看起来“一起”。