多个供应商的占位符样式不起作用答案

【问题标题】：Placeholder styles for multiple vendors not working多个供应商的占位符样式不起作用
【发布时间】：2014-07-24 15:17:56
【问题描述】：

我偶然发现了一个非常奇怪的错误。我定义了一个为占位符着色的::-webkit-input-placeholder 规则。然后我将::-moz-placeholder 添加到其中，将它们组合成一个规则：

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

同时，这些选择器中的每一个都可以单独工作（仅限 webkit 或仅限 moz），用逗号分隔它们根本不起作用。请参阅jsfiddle 中的示例，您可以在 webkit 和 firefox 中尝试。

【问题讨论】：

【解决方案1】：

当浏览器遇到无效的选择器时，它会忽略整个选择器列表。 -moz 无法被 webkit 识别，-webkit 无法被 Firefox 识别。这就是它在两个浏览器中都失败的原因

顺便说一句，根据this comment from CSS-Tricks，看起来 IE7 的行为不同

【讨论】：