css - :checked を使用して、ページ上の任意の要素の CSS を切り替えますか?

Question

チェックボックスを使用して、それに隣接する要素のスタイルを設定する方法について最近聞いたことがあります。

.checkbox-whatever:checked + .toggling-element{
 Some css
}

今、私は同じことをしたいのですが、次の要素だけでなく、グローバルに適用されるcssを使用します。基本的に、チェックボックスがチェックされている間、css は次のように動作します。

.toggling-element{
Some css
}

次に、チェックボックスに隣接する要素だけでなく、クラス「トグル要素」を持つすべての要素に適用されます。

それは可能ですか？

Answer 1

.toggle-elementあなたの要素があなたのすべての兄弟ではないと仮定します.checkbox-whatever:

いいえ、CSS には親要素を選択する方法がないため、JavaScript なしではこれを行うことはできません。

マークアップをそのように構成しないと想定しても安全だと思います。それはあまりにも非現実的です。