如何设置"占位符"文本的颜色？

Question

是否可以设置placeholder文本的颜色？

<textarea placeholder="Write your message here..."></textarea>

Answer 1

::-webkit-input-placeholder { /* WebKit browsers */
    color:    #999;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #999;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #999;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #999;
}

Answer 2

没有人喜欢"参考这个答案"的答案,但在这种情况下它可能会有所帮助:用CSS更改HTML5输入的占位符颜色

由于它只受到几个浏览器的支持,你可以试试jQuery占位符插件(假设你可以\正在使用jQuery).它允许您通过CSS设置占位符文本的样式,因为它实际上只是它与焦点事件的交换技巧.

但是,插件不会在支持它的浏览器上激活,因此您可以使用针对chrome\firefox的CSS和jQuery插件的CSS来捕获其余部分.

该插件可以在这里找到:https://github.com/mathiasbynens/jquery-placeholder

Answer 3

试试这个

textarea::-webkit-input-placeholder {  color: #999;}

Answer 4

为了给占位符一个颜色,只需使用以下代码行:

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