为什么我不能为不同的浏览器分组特定于浏览器的CSS选择器？

Question

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

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

问题是该规则未得到应用.但是,如果我这样打破它,它可以正常工作:

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

为什么我不能对特定于浏览器的选择器进行分组,还是有其他方法可以做到这一点？对同一元素重复两次相同的属性是不对的.

更新:

刚刚发现这个资源说明它无法完成,但到目前为止还没有关于原因的信息.看起来奇怪的是,浏览器必须放弃整个规则,因为它无法识别其中一个选择器.

Answer 1

如果一组选择器中的一个选择器无效,则浏览器必须将整个规则视为无效.或至少说W3C.

我不确定为什么会出现这种行为,但我认为这是因为无效的选择器可能会破坏一般的CSS语法,使得浏览器无法可靠地猜测无效选择器的结束位置和有效元素的开始.