Internet Explorer 占位符样式问题答案

【问题标题】：Internet Explorer placeholder styling issueInternet Explorer 占位符样式问题
【发布时间】：2014-11-24 00:26:09
【问题描述】：

尝试将样式应用于占位符我遇到了一个问题，即在 IE（所有版本）中占位符文本颜色不适用。只取文本输入的颜色

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

input {
    color:black;
}

应用此代码后，占位符的颜色将为黑色。

可能是什么问题？

【问题讨论】：

【解决方案1】：

您需要为特定输入指定此规则：

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

input {
    color:black;
}

选择器：-ms-input-placeholder {...}

请注意，这仅适用于 IE>10 浏览器。

【讨论】：

您确定没有启用兼容模式并且您的浏览器不能在 Quirks 模式下工作吗？你的页面上有 doctype 吗？
是的 - 我确定。 Doctype也在我的html中
你有一些页面示例吗？这个链接对你有用吗？ jsfiddle.net/ct0Lx3t3 。此外，如果您使用 3rd 方插件为不受支持的浏览器添加占位符，您是否可以禁用它们并查看它们是否导致了问题？
删除所有 js 添加并留下 css - 不起作用。在 jsFiddle 中它工作正常。奇怪的是，我的 css 用于输入元素。
@eatmypants 这很奇怪，在另一个地方似乎有问题。你有活生生的例子吗？

【解决方案2】：

如果您正在寻找对所有浏览器的支持，请查看以下答案：

【讨论】：

OP 寻找样式占位符，而不是在旧浏览器中启用它。此外，仅链接的答案应该是 cmets 而不是 meta.stackexchange.com/questions/8231/…
已经在用了，但是我加了之后- IE
或标记为重复

【解决方案3】：

解决方案：

在我的 css 中，我为表单输入 (div_name form > input {}) 指定了文本的颜色，这对于浏览器来说是比指定为选择器更有价值的参数：-ms-input-placeholder {} 占位符颜色。（这很奇怪。它们用于不同的目的，但没关系）

【讨论】：

【解决方案4】：

IE11 需要 !important 标志来覆盖默认的用户代理样式。

这是适用于 IE 版本 10 和 11 的规则集。

/* - Internet Explorer 10–11
   - Internet Explorer Mobile 10-11 */
:-ms-input-placeholder {
    color: white !important;
}

有关所有浏览器的详细信息，请参阅问题Placeholder CSS not being applied in IE 11 的答案。

对于早于 10 的 IE 版本，您需要一个 polyfill 来支持占位符。这些 CSS 会有所不同。参考 polyfill。

【讨论】：