0

关于这里的代码：

小提琴中的单选按钮没有像单选按钮那样起作用。

我不熟悉 CSS 中的 + ，我想知道这是否与它有关。

4

5 回答 5

5 
input[type="radio"]:checked+label{ ..... } 
 //a label that immediately follows an input of type radio that is checked
于 2012-05-17T23:33:49.327 回答
4

CSS 中的 + 号表示与第一个选择器相邻的选择器。

在您的示例中，+ 号正在修改标签，而不是实际的单选按钮，而只是标签。

现在它不起作用，因为您没有为单选按钮指定组名（或名称），请尝试以下 html。

<form>
  <input type="radio" id="radio1" name="rdo">
  <label for="radio1"></label>
  <input type="radio" id="radio2" name="rdo">
  <label for="radio2"></label>
</form>
​

现在单选按钮绑定到相同的名称并且将正常工作。

干杯，尼科

于 2012-05-17T23:37:24.363 回答
3

这会选择相邻的元素，请参阅你必须记住的 30 个 CSS 选择器。

自由贸易协定：

这被称为相邻选择器。它将仅选择紧接在前一个元素之前的元素。在这种情况下，只有每个 ul 之后的第一段会有红色文本。

IE7+ 支持

于 2012-05-17T23:33:46.550 回答
2

它匹配紧接在另一个指定元素之前的元素。

label在您的示例中，这意味着它input匹配type="radio".

此处有关选择器的更多信息：http: //www.w3.org/TR/CSS2/selector.html

于 2012-05-17T23:34:07.453 回答
1

如果您指的是单选按钮不是互斥的（您可以选择多个），那是因为 html 没有将单选按钮定义为同一组的一部分。使用 name 属性来实现这一点。

<form>
  <input type="radio" name="radioGroup" id="radio1">
  <label for="radio1"></label>
  <input type="radio" name="radioGroup" id="radio2">
  <label for="radio2"></label>
</form>
​

我相信您关于 CSS 中 + 的问题是不相关的，但它在其他答案中被正确识别为下一个兄弟。

于 2012-05-17T23:33:20.407 回答