CSSで複数の属性セレクターを指定する

次のようなことをするための構文は何ですか？

input[name="Sex" AND value="M"]

基本的に、input属性と属性を持つ要素を選択name="Sex"しますvalue="M"：

<input type="radio" name="Sex" value="M" />

次のような要素は選択しないでください。

<input type="radio" name="Sex" value="F" />

シンプルinput[name=Sex][value=M]はかなりいいでしょう。そして、それは実際には標準のドキュメントでよく説明されています：

複数の属性セレクターを使用して、要素の複数の属性を参照したり、同じ属性を複数回参照したりすることもできます。

ここで、セレクターは、「hello」属性の値が「Cleveland」と正確に一致し、「goodbye」属性の値が「Columbus」と完全に一致するすべてのSPAN要素に一致します。

span[hello="Cleveland"][goodbye="Columbus"] { color: blue; }

補足として、属性値を囲む引用符は、この値が有効な識別子ではない場合にのみ必要です。

JSFiddleデモ

それを連結するためです：

input[name="Sex"][value="M"] {}

そして、組合を取るためには：

input[name="Sex"], input[value="M"] {}

属性セレクターを連結します。

input[name="Sex"][value="M"]

セレクターと開始ブラケットの間にスペースがあってはならないことを追加するだけです。

td[someclass] 

動作します。だが

td [someclass] 

しない。

[class*="test"],[class="second"] {
background: #ffff00;
}