html - 如何选择之前的标签并选中复选框？

Question

当选中复选框但标签位于复选框之前时，我想将样式应用于标签。

我的代码是:

<label class="label" for="main-checkbox">LABEL</label><br />
<input type="checkbox" id="main-checkbox">

我一直在努力使用 css 选择器来做到这一点。

Answer 1

您可以修改“checked”状态...不过它不适用于旧版浏览器。

http://jsfiddle.net/CjpmP/

HTML

<div>
  <input type="checkbox" id="check" class="check-with-label" />
  <label for="check" class="label-for-check">My Label</label>
<div>

CSS

.check-with-label:checked + .label-for-check {
  font-weight: bold;
}

我会建议使用 javascript，这样您就可以使用更传统的 CSS 规则，尽管... http://jsfiddle.net/MGVHX/1/