为什么不能在一个CSS规则中结合:: selection和::-moz-selection? [英] Why can't I combine ::selection and ::-moz-selection in one CSS rule?

问题描述

我非常喜欢使用::selection和::-moz-selection来修饰一个网站-我讨厌默认的蓝色和白色！

I'm a big fan of using ::selection and ::-moz-selection to spruce up a website a bit - I hate the default blue and white colours!

但是，我发现有一件小事确实困扰我:我不能将::selection和::-moz-selection放在相同的CSS规则中，如下所示:

However, I find one little thing that really bugs me: I can't put ::selection and ::-moz-selection in the same CSS rule, like this:

::selection, ::-moz-selection {
    background:#8A1920;
    color:#FFFF;
}

jsFiddle链接

我觉得这很烦人，因为这意味着如果我想更改背景颜色(或其他选择样式)，则必须编辑两个单独的规则.这也违反了我几乎虔诚奉行的政策:D.R.Y. (不要重复自己).

I find this quite annoying, because it means that if I want to change my background colour (or some other selection style) I have to edit two separate rules. It also violates a policy I follow almost religiously: D.R.Y. (don't repeat yourself).

我在Chrome 28，Chrome Canary 30，Firefox 22，Firefox 23，IE 9和IE 10中对此进行了测试，它们均产生相同的结果.怎么了?

I tested this in Chrome 28, Chrome Canary 30, Firefox 22, Firefox 23, IE 9 and IE 10 and they all yield the same result. What's going wrong here?

如果必须将它们分开，是否有任何方法可以使它们进一步连接?像这样:

If they must remain separate, is there any way to have them join further on? Something like:

.selected {
    background:#8A1920;
    color:#FFF;
}

::selection {
    @copy-from(.selected); /* I know this line is completely made up */
}

::-moz-selection {
    @copy-from(.selected);
}

真的很有用.

推荐答案

这来自文档:

Gecko是唯一需要前缀的引擎.由于这个事实 CSS解析规则要求在以下情况下删除整个规则 遇到无效的伪元素，必须有两个单独的规则 写道:::-moz-selection，:: selection {...}.规则是 在非Gecko浏览器上删除，因为:::-moz-selection在它们上无效.

Gecko is the only engine requiring the prefix. Due to the fact that the CSS parsing rules require dropping the whole rule when encountering an invalid pseudo-element, two separate rules must be written: ::-moz-selection, ::selection {...}. The rule would be dropped on non-Gecko browsers as ::-moz-selection is invalid on them.

https://developer.mozilla.org/zh- US/docs/Web/CSS/:: selection

这篇关于为什么不能在一个CSS规则中结合:: selection和::-moz-selection?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！