这篇翻译不完整。请帮忙从英语翻译这篇文章

这是一个实验中的功能
此功能某些浏览器尚在开发中,请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订,所以在未来版本的浏览器中该功能的语法和行为可能随之改变。

概要

The :any() pseudo-class lets you quickly construct sets of similar selectors by establishing groups from which any of the included items will match. This is an alternative to having to repeat the entire selector for the one item that varies.

译文:any()伪类可以让您快速构建类似的选择器集合,通过建立包含所有包含项的组来匹配。这是另一种选择,它必须重复整个选择器,因为其中一个项目是不同的。

Note : This pseudo-class is in progress to be standardized in CSS Selectors Level 4 under the name :matches(). It is likely that the syntax and name of :-vendor-any() will be changed to reflect it in the near future.
注意:这个伪类正在CSS选择器第4级按照名称:matches()进行标准化。很可能的语法和名称:- vendor-any()将在不久的将来被更改以反映它。

语法

:-moz-any( <selector># )
:-webkit-any( <selector># )

selector
选择器。这可以是由 CSS 3 简单选择器 组成的简单选择器或多重选择器,并且可以包含后代组合器。
注意:选择器可以包含伪元素,并且仅允许的组合器是后代组合器。

例子

举个例子,如以下 CSS:

/* 3 deep (or more) unordered lists use a square */
ol ol ul,     ol ul ul,     ol menu ul,     ol dir ul,
ol ol menu,   ol ul menu,   ol menu menu,   ol dir menu,
ol ol dir,    ol ul dir,    ol menu dir,    ol dir dir,
ul ol ul,     ul ul ul,     ul menu ul,     ul dir ul,
ul ol menu,   ul ul menu,   ul menu menu,   ul dir menu,
ul ol dir,    ul ul dir,    ul menu dir,    ul dir dir,
menu ol ul,   menu ul ul,   menu menu ul,   menu dir ul,
menu ol menu, menu ul menu, menu menu menu, menu dir menu,
menu ol dir,  menu ul dir,  menu menu dir,  menu dir dir,
dir ol ul,    dir ul ul,    dir menu ul,    dir dir ul,
dir ol menu,  dir ul menu,  dir menu menu,  dir dir menu,
dir ol dir,   dir ul dir,   dir menu dir,   dir dir dir {
  list-style-type: square;
}

可以写成这样:

/* 3 deep (or more) unordered lists use a square */
:-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) ul,
:-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) menu,
:-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) dir {
  list-style-type: square;
}

但是,不能写成这样(详见the section on performance):

:-moz-any(ol, ul, menu, dir) :-moz-any(ol, ul, menu, dir) :-moz-any(ul, menu, dir) {
  list-style-type: square;
}

Notes

译文: 这个伪类选择器会在处理 HTML5 的 sections and headings 中尤其有用。因为 <section>, <article>, <aside>, 和 <nav> 可以被嵌套,如果不使用  :any() ,为了去匹配这些标签来给予样式会变得困难。

举个例子,当不使用 :any() ,给予不同的 DOM  结点层次深度下的所有的 <h1>  的元素样式时,将会变得特别的复杂。

/* Level 0 */
h1 {
  font-size: 30px;
}
/* Level 1 */
section h1, article h1, aside h1, nav h1 {
  font-size: 25px;
}
/* Level 2 */
section section h1, section article h1, section aside h1, section nav h1,
article section h1, article article h1, article aside h1, article nav h1,
aside section h1, aside article h1, aside aside h1, aside nav h1,
nav section h1, nav article h1, nav aside h1, nav nav h1, {
  font-size: 20px;
}
/* Level 3 */
/* ... don't even think about it*/

然而,通过使用  :any() ,这将变得很简单:

/* Level 0 */
h1 {
  font-size: 30px;
}
/* Level 1 */
:-moz-any(section, article, aside, nav) h1 {
  font-size: 25px;
}
/* Level 2 */
:-moz-any(section, article, aside, nav)
:-moz-any(section, article, aside, nav) h1 {
  font-size: 20px;
}
/* Level 3 */
:-moz-any(section, article, aside, nav)
:-moz-any(section, article, aside, nav)
:-moz-any(section, article, aside, nav) h1 {
  font-size: 15px;
}

性能与特异性问题

Bug 561154 追踪了一个关于 Gecko 作为内核的浏览器在使用 :-moz-any() 不正确的问题。在最新的浏览器(从 Firefox 12) 实现 :-moz-any() 有一个通用的规则,在使用这个伪类选择器时,当使用它作为最右边的选择器会比使用 ID, Class, 标签选择器作为最右边的选择器要来的慢。

例如:

.a > :-moz-any(.b, .c)

会比下面的表达式慢

.a > .b, .a > .c

而下面的表达式将会是最快的

:-moz-any(.a, .d) > .b, :-moz-any(.a, .d) > .c

浏览器兼容性

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Feature Firefox (Gecko) Chrome Internet Explorer Opera Safari
Basic support 4.0 (2)-moz 12.0 (534.30)-webkit ? ? 5
-webkit
Feature Android Chrome for Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support ? (Yes)-webkit ? ? ? 5
-webkit

文档标签和贡献者

此页面的贡献者: Minya_Chan, LinYunweb, shuihuo, tigercao
最后编辑者: Minya_Chan,