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

Question

做类似的事情的语法是什么:

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" />

Answer 1

简单input[name=Sex][value=M]会做得很好.它实际上在标准文档中有详细描述:

多个属性选择器可用于引用元素的多个属性,甚至可以多次引用相同的属性.

这里,选择器匹配所有SPAN元素,其"hello"属性具有"Cleveland"值,其"goodbye"属性具有"Columbus"值:

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

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

JSFiddle演示

Answer 2

为了连接它:

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

为了获得工会,它是:

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

Answer 3

连接属性选择器:

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

Answer 4

只是要补充一点，选择器和开口支架之间应该没有空间。

td[someclass] 

将工作。但

td [someclass] 

将不会。