2017-01-25 2 views
3

これは、私はいくつかのピュアCSSホテルランクシステムを探していたんだ。このここcodepen https://codepen.io/jamesbarnett/pen/vlpkh?editors=1100CSS:紛らわしい行動をセレクタない

を参照しています。私はその声明と実際に混乱した。 .rating:not(:checked) > label:hover

誰かが私にどのように説明できるか? .ratingはフィールドセット要素です。どのようにして:not(:checked)セレクタを適用することさえできますか?それは決してチェックされることはありません。これが.rating input:not(:checked)だったら、それは私にとって理にかなっていたでしょう。

内部の入力を何とか選択しているような感じですか? CSS :notセレクタのこの動作をサポートするドキュメントは見つかりません。

私はそれがどのように驚くほど働いているのか理解できません。

+0

ここにHTMLとCSSを追加してください。あなたのコードを見るために、読者にリンクに従わせるよう強制しないでください。 – BoltClock

+0

@BoltClockそれに答えることを望む誰もが簡単にできるように、codepenに言及することは良い習慣です。フォーラムに参加している人々は、ほとんどの場合、codepensやfiddlesを求めています。 –

+0

あなたの質問には、リンクをクリックすることなく答えられる人はいません。それは容認できません。あなたはペンを含めることができますが、あなたがそれを含めるかどうかにかかわらず、コードは質問*に関係している必要があります。 – BoltClock

答えて

2

クラス 'rating'を持つ要素がチェック可能な入力要素ではないため、:checked疑似クラスは決して一致しません。

逆に、not(:checked)意志常に一致(demo) - (追加の特異性を除く)が機能的に冗長化し、従って安全にあなたがそのセレクタからの擬似クラスを削除することができ

注意を省略することができますデモでも同じように動作します (updated codepen)。

関連する問題