CSS :matches() 伪类

：Matches()是一个新的css伪类，它允许通过将选择器分组在一起来节省时间：

1:matches(article, div.section, section) h2 {
2  font-size: 3em;
3}
4
5/* Is this equivalent of this: */
6article h2, div.section h2, section h2 {
7  font-size: 3em;
8}

这里有另一个例子来说明这一点：

 1:matches(.main, p, div.my-stuff) :matches(h1, h2, h3, h4) {
 2  border: 2px dotted rgba(255,134,34,0.5);
 3}
 4
 5/* Is this equivalent of this: */
 6.main h1,
 7.main h2,
 8.main h3,
 9.main h4,
10p h1,
11p h2,
12p h3,
13p h4,
14div.my-stuff h1,
15div.my-stuff h2,
16div.my-stuff h3,
17div.my-stuff h4 {
18  border: 2px dotted rgba(255,134,34,0.5);
19}

在第二个示例中，输入所有这些内容节省了大量时间！这真的可以让你的css文件变得更小。

浏览器支持

MythMyth是现在开始使用：matches（)的好选择。

[Can我使用css-matches-pseudo？] (http：//caniuse.com/# feat=css-matches-pseudo)caniuse.com提供的主要浏览器对css-matches-pseudo功能的支持数据。