为什么我不能为不同的浏览器分组浏览器特定的CSS选择器？ [英] Why can I not group browser-specific CSS-selectors for different browsers?

问题描述

我只是尝试编写以下规则来为支持它的浏览器设置输入占位符的样式：

I just tried to write the following rule to style the input placeholder for browsers that support it:

#main input::-webkit-input-placeholder,
#main input:-moz-placeholder
{
    color: #888;
    font-style: italic;
}

问题是不应用规则。但是，如果我这样分解，它的工作很好：

The problem is that the rule isn't applied. However, if I break it up like this instead it works just fine:

#main input::-webkit-input-placeholder
{
    color: #888;
    font-style: italic;
}
#main input:-moz-placeholder
{
    color: #888;
    font-style: italic;
}

为什么我不能分组浏览器特定的选择器，做吗？对同一个元素重复相同的属性两次是不正确的。

Why can I not group browser-specific selectors, or is there another way to do it? It doesn't feel right to repeat the same attributes twice for the same element.

更新：

刚刚找到这个资源说明它不能做，但到目前为止没有关于为什么的信息。

Just found this resource stating that it cannot be done, but so far no information on why. It seems odd that the browser should have to discard the entire rule just because it doesn't recognize one of the selectors.

推荐答案

浏览器应该丢弃整个规则，因为它不能识别其中一个选择器。如果一组选择器中的一个选择器无效，则浏览器必须将整个规则视为无效。或者至少如此说W3C 。

If one selector in a group of selectors is invalid, the browser must treat the entire rule as invalid. Or at least so says the W3C.

我不知道为什么这个行为是强制的，但是一推，我猜测，这是因为一个无效的选择器可以打破一般的CSS语法，使浏览器不可靠的猜测无效的选择器的结束和有效的元素开始。

I'm not sure why this behaviour is mandated, but at a push, I'd guess it's because an invalid selector could break general CSS syntax, making it impossible for a browser to reliably guess where the invalid selector ends and valid elements begin.

这篇关于为什么我不能为不同的浏览器分组浏览器特定的CSS选择器？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！