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 セレクター を参照してください。

FTA:

これを隣接セレクタと呼ぶ。前の要素の直前にある要素のみが選択されます。この場合、各 ul の後の最初の段落だけが赤いテキストになります。

IE7+ でサポート

于 2012-05-17T23:33:46.550 に答える
2

指定された別の要素の直前の要素に一致します。

あなたの例では、これは、の要素に続くすべての要素と一致することを意味しlabelます。inputtype="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 に答える