在 CSS 中指定多个属性选择器

Question

执行以下操作的语法是什么：

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

基本上，我想选择具有属性 name="Sex" 以及属性 value="M" 的 input 元素：

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

不应 选择以下元素：

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

原文由 John 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

简单 input[name=Sex][value=M] 会做得很好。它实际上在 标准文档 中得到了很好的描述：

多个属性选择器可以用来引用一个元素的多个属性，甚至可以多次引用同一个属性。

在这里，选择器匹配所有“hello”属性的值恰好为“Cleveland”且“goodbye”属性的值恰好为“Columbus”的所有 SPAN 元素：

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

作为旁注，仅当属性值不是有效标识符时，才需要在属性值周围使用引号。

JSFiddle 演示

原文由 raina77ow 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

连接它是：

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

对于联合，它是：

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

原文由 Yogesh Khater 发布，翻译遵循 CC BY-SA 3.0 许可协议