组合的 CSS 选择器不起作用？ [复制]

Question

这行得通：

input::-webkit-input-placeholder {
   color: red;
}

input:-moz-placeholder { 
   color: red;  
}

input::-moz-placeholder { 
   color: red;  
}

input:-ms-input-placeholder {  
   color: red;  
}

但这无济于事，至少在 Chrome 上：

input::-webkit-input-placeholder,
input:-moz-placeholder, 
input::-moz-placeholder,
input:-ms-input-placeholder {  
   color: red;  
}

为什么会这样？

Answer 1

查看spec中的警告：

一个以逗号分隔的选择器列表表示所有选择器的联合 列表中每个单独的选择器选择的元素。

警告：在这个例子中等价是正确的，因为所有的 选择器是有效的选择器。如果这些选择器中只有一个是 无效，则整个选择器组都将无效。

然后，这组选择器不起作用，因为每个浏览器只接受它的供应商前缀，而其他的都是无效的。