输入字段中占位符文本的颜色答案

【问题标题】：Color of placeholder text in an input field输入字段中占位符文本的颜色
【发布时间】：2010-02-26 20:19:37
【问题描述】：

我有一个包含占位符文本的输入字段。我想要一个词是不同的颜色，比如红色，我该怎么做？设置跨度样式并用跨度包围单词不起作用。

例如在这个网站上，我想将短语“搜索 649 个广播故事”中的数字设为红色。

【问题讨论】：

【解决方案1】：

我一个字都说不出来，但如果您要设置整个占位符的样式，请阅读此内容。

由于目前仅 WebKit 支持占位符，因此您可以使用以下css rule：

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

对于其他浏览器，随着对占位符属性的支持不断发展，您将不得不使用不同的规则。对于基于 Gecko 的浏览器，您可能需要观看 Mozilla 的 bug 457801 以了解最终解决方案是什么。

【讨论】：

【解决方案2】：

如何在单击时消失的输入上覆盖一个 div（然后将焦点指向输入）？这样您就可以根据需要设置文本部分的样式。

$('#myInputOverlayDiv').click(function() {
    $(this).hide();
    $('#myInputElement').focus();
})

【讨论】：