CSSを使用してチェックされたラジオボタンのラベルのスタイルを設定するにはどうすればよいですか?

チェックされたラジオ ボタンのラベルのスタイルを設定する方法

CSS を使用してチェックされたラジオ ボタンのラベルのスタイルを設定するには、次の方法を使用します。隣接する兄弟コンビネータの ( ).

問題:

「label:checked」セレクターを使用して、チェックされたラジオ ボタンのラベルのスタイルを設定しようとすると、望ましい結果が得られない可能性があります。

解決策:

隣接する兄弟を雇用するCSS セレクターのコンビネーター () を使用して、チェックされたラジオ ボタン入力の直後に続くラベルをターゲットにします。

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

マークアップの例:

<input>

この CSS ルール指定されたスタイルは、チェックされたラジオ ボタン入力に隣接するラベルにのみ適用されます。追加要素の存在に関係なく、入力の後にラベルが続く任意の HTML 構造と互換性があります。

以上がCSSを使用してチェックされたラジオボタンのラベルのスタイルを設定するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。