Javascript 如果在样式标签下，则无法选中复选框

我正在尝试设置复选框输入的样式。我知道这是不可能的，因为浏览器。因此，我为输入[type=checkbox]提供了隐藏可见性，并使用FontAwesome图标设置了标签样式，选中输入时显示ok。我的问题是，如果我把输入放在标签的同一位置，输入就不会因为标签而被检查。因此，我必须将输入放在标签旁边，但这对用户来说并不好。因此，如果有人有一个技巧或解决方案，这将是伟大的

。登录{
背景色：$原色不透明度；
填充：7%9%7%；
文本对齐：居中；
p{
文本对齐：左对齐；
}
输入{
宽度：40%；
高度：40px；
填充：1%；
}
输入[类型=复选框]{
不透明度：0；
垂直对齐：中间对齐；
宽度：20px；
颜色：$错误颜色；
}
a{
利润率最高：3%；
}
}
输入[类型=复选框]+标签：：之前{
内容：“；
位置：绝对位置；
左：55px；
顶部：122px；
宽度：18px；
高度：20px；
显示：块；
背景：白色；
边界：无；
}
输入[类型=复选框]+标签：：后{
内容：“\f00c”；
字体系列：“FontAwesome”；
颜色：$选择器颜色；
位置：绝对位置；
左：55px；
顶部：122px；
宽度：23px；
高度：23px；
显示：块；
z指数：1；
不透明度：0；
}
输入[类型=复选框]：选中+标签：：后{
不透明度：1；
}

参与方必须遵守特定条件和流动性计划

苏巴斯塔酒店

为标签指定一个与复选框输入的

id=“

属性相对应的

”

属性-这样，当单击标签时，复选框将被选中

我在下面的示例中使用了“check1”作为值：

<div class="log-in" >
  <p>Para poder participar debe aceptar las Condiciones particulares y el Plan de liquidación.</p>
  <div>
    <input id="check1" type="checkbox" ng-model="BscCtrl.conditions" ng-change="BscCtrl.checkConditions()">
    <label for="check1">Acepto las <a href="" class="color-link">Condiciones particulares</a> de la subasta</label>
  </div>
</div>

参与方必须遵守特定条件和流动性计划

苏巴斯塔酒店

/*自定义复选框CSS*/
.自定义复选标记{
位置：相对位置；
}
.自定义复选标记输入[类型=复选框]{
不透明度：0；
}
.自定义复选标记标签{
左边距：25px；
}
.custom checkmark input[类型=复选框]：选中+标签：之前，.custom checkmark input[类型=复选框]：悬停+标签：之前{
边框颜色：#369FF4；
}
.自定义复选标记输入[类型=复选框]：选中+标签：之前{
内容：“\2713”；
线高：1.2；
}
.custom checkmark input[类型=复选框]+标签：之前，.custom checkmark input[类型=收音机]+标签：之前{
内容：“；
显示：内联块；
边框：1px实心#C9C9C9；
/*字体系列：“cw图标”*/
背景色：#FFF；
文本对齐：居中；
边界半径：2px；
颜色：#369FF4；
}
.自定义复选标记输入[类型=复选框]，.自定义复选标记标签：在{
位置：绝对位置；
宽度：20px；
高度：20px；
左：0；
排名：0；
}

将此作为每月定期赠送的礼物

Brilliant SimmerDesign。你完全正确。它现在工作得很好。我喜欢这种不改变太多代码的简单解决方案。非常感谢你做的很好。但我只需要label元素中的for=”“来链接复选框，就像您在代码中所做的一样。我的复选框与此完美配合。非常感谢。好啊我只是想和大家分享一下自定义的css复选框，觉得它和你的代码不一样，也许我理解错了，你的css本身不起作用