0 
<span class='radio'>Place holder for Radio1</span>
<input checked type=radio name='radio' class='radio'>
<span class='radio'>Place holder for Radio2</span>
<input type=radio name='radio' class='radio'>

在这种情况下，我只希望<span>与相应的单选按钮相关联是可见的，但是......

* {
    visibility:hidden
}
.radio + .radio:checked {
    visibility:visible;
}

不起作用，而这样做：

* {
    visibility:hidden
}
.radio:checked + .radio {
    visibility:visible;
}

那么为什么我不能选择和操作与前一个相邻兄弟相关的 css 呢？

[jsfiddle]

4

1 回答 1

2

因为+只能选择下一个兄弟，而不是前一个。

您还设置了一个非常有趣的示例，说明当您有两个具有相同类名的完全不同的元素并且您尝试按类选择一个或另一个时会出现什么问题。如果选择器双向工作，那么无论您如何编写选择器+，您的前两个元素都会有。visibility: visible

没有先前的兄弟选择器，因此您需要找到另一种解决方法。此外，“一般”同级选择器是~, not +，尽管没有一个能够到达以前的同级...

于 2012-11-27T02:44:55.287 回答