如何创建带有可单击标签的复选框？

方法1：包装标签标签

将复选框包装在标签标记内：

&lt；标签&gt&书信电报；输入类型=&quot；复选框“；名称=“名称”；复选框“；值=”；“价值”&燃气轮机；文本&lt/标签&gt；

方法2：使用for属性

使用for属性（匹配复选框id）：

&lt；输入类型=&quot；复选框“；名称=“名称”；复选框“；id=”号；复选框“U id”；值=”；“价值”&燃气轮机；
&lt；标签for=&quot；复选框“U id”&燃气轮机；文本&lt/标签&gt；

注意：ID在页面上必须是唯一的

解释

由于其他答案没有提到它，一个标签最多可以包含1个输入，并省略for属性，并且假定它是针对其中的输入

摘自w3.org（我的重点是）：

[for属性]将定义的标签与另一个控件显式关联。存在时，此属性的值必须与同一文档中其他控件的id属性的值相同不存在时，定义的标签与元素的内容相关联。

若要隐式地将标签与另一个控件关联，控件元素必须位于标签元素的内容中。在这种情况下，标签只能包含一个控制元素。标签本身可以放置在相关控件之前或之后

标签{
边框：1px实心#ccc；
填充：10px；
利润率：0.10px；
显示：块；
}
标签：悬停{
背景：#eee；
光标：指针；
}

&lt；标签&gt&书信电报；输入类型=“复选框”/&gt；方案1&lt/标签&gt；
&lt；标签&gt&书信电报；输入类型=“复选框”/&gt；方案2&lt/标签&gt；
&lt；标签&gt&书信电报；输入类型=“复选框”/&gt；方案3&lt/标签&gt