在 CSS 中指定多个属性选择器
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12340737/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Specify multiple attribute selectors in CSS
提问by John
What is the syntax for doing something like:
执行以下操作的语法是什么：
input[name="Sex" AND value="M"]
Basically, I want to select the inputelement that has the attribute name="Sex"as well as the attribute value="M":
基本上，我想选择input具有属性name="Sex"以及属性的元素value="M"：
<input type="radio" name="Sex" value="M" />
Elements such as the following should notbe selected:
元件如以下应该没有被选择：
<input type="radio" name="Sex" value="F" />
回答by raina77ow
Simple input[name=Sex][value=M]would do pretty nice. And it's actually well-described in the standard doc:
简单input[name=Sex][value=M]会很好。它实际上在标准文档中有很好的描述：
Multiple attribute selectors can be used to refer to several attributes of an element, or even several times to the same attribute.
Here, the selector matches all SPAN elements whose "hello" attribute has exactly the value "Cleveland" and whose "goodbye" attribute has exactly the value "Columbus":
span[hello="Cleveland"][goodbye="Columbus"] { color: blue; }
多个属性选择器可用于引用元素的多个属性，甚至多次引用同一属性。
在这里，选择器匹配所有“hello”属性的值恰好为“Cleveland”并且其“goodbye”属性的值恰好为“Columbus”的 SPAN 元素：
span[hello="Cleveland"][goodbye="Columbus"] { color: blue; }
As a side note, using quotation marks around an attribute value is required only if this value is not a valid identifier.
作为旁注，仅当该值不是有效标识符时才需要在属性值周围使用引号。
回答by Yogesh Khater
For concatenating it's:
连接它是：
input[name="Sex"][value="M"] {}
And for taking union it's:
而对于联合来说，它是：
input[name="Sex"], input[value="M"] {}
回答by Dennis
Concatenate the attribute selectors:
连接属性选择器：
input[name="Sex"][value="M"]
回答by Jean-Philippe Martin
Just to add that there should be no space between the selector and the opening bracket.
只是要补充一点，选择器和左括号之间不应该有空格。
td[someclass]
will work. But
将工作。但
td [someclass]
will not.
将不会。
回答by Eli
[class*="test"],[class="second"] {
background: #ffff00;
}
