选中单选按钮时突出显示html元素w / o js

Question

我想知道在没有使用js的情况下选择单选按钮时是否有办法修改html项目（即div）。这是标记：

<div class="container">
    <input id="myRadioBtn" class="btn-radio" type="radio" name="name" value="value"/>
    <div class="box">BOX</div>
</div>

我希望“box”在选择“myRadioBtn”后更改其颜色。我知道我可以使用js / jQuery，但如果可能的话，我只想在CSS中使用它。这可能吗？

Answer 1

#myRadioBtn:checked + .box {
    background-color:red;
}

http://jsfiddle.net/tyEys/

我无法检查它是否在IE8中有效。

编辑：你可以用〜替换+，只选择收音机后面的.box。所以，如果收音机后有2个盒子，第二个盒子不会受到影响。

Answer 2

input[type="radio"]:checked + .box {
    font-weight: bold;
}

<强> jsFiddle example