选中复选框时更改标签文本颜色

Question

我正在尝试在用户选中复选框但不起作用时更改标签的文本颜色。我看过一些示例，但其中 none 与我的以下代码一起使用：

<label class="subCatRegVars"><input type="checkbox" name="subCatRegVars" value="vlr_adc_brt_serv"> VAB </label>

CSS:
.subCatRegVars + input[type=checkbox]:checked {
      font-weight: bold;
      color: red;
}

任何帮助都会很棒！

干杯

Answer 1

您可以添加 span 来换行。

input[type=checkbox]:checked + span {
  font-weight: bold;
  color: red;
}

<label class="subCatRegVars">
  <input type="checkbox" name="subCatRegVars" value="vlr_adc_brt_serv">
  <span>VAB</span>
</label>

选中复选框时更改标签文本颜色

Change label text color when checkbox is checked

css

label

input