Chrome支持input[type=text]元素的占位符属性（其他元素可能也支持）。
但以下CSS对占位符的值没有任何作用：
输入[占位符]、[占位符]，*[占位符]{颜色：红色！重要的}<input-type=“text”placeholder=“Value”>
但Value仍将保持灰色而不是红色。
是否有方法更改占位符文本的颜色？
当前回答
：：占位符{颜色：红色；}<input-type=“text”placeholder=“Value”>
其他回答
最简单的方法是：
#yourInput::placeholder {
color: red;/*As an example*/
}
/* if that would not work, you can always try styling the attribute itself: */
#myInput[placeholder] {
color: red;
}
在html文件中：
<input type="text" placeholder="placeholder" class="redPlaceHolder">
在css文件中：
.redPlaceHolder{
color: #ff0000;
}
好的，占位符在不同浏览器中的行为不同，因此您需要在CSS中使用浏览器前缀来使它们相同，例如Firefox默认为占位符提供透明度，因此需要在CSS中添加不透明度1，加上颜色，这在大多数情况下不是一个大问题，但保持它们一致性很好：
*::-webkit-input-placeholder { /* WebKit browsers */
color: #ccc;
}
*:-moz-placeholder { /* Mozilla Firefox <18 */
color: #ccc;
opacity: 1;
}
*::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #ccc;
opacity: 1;
}
*:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: #ccc;
}
除了toscho的回答，我还注意到Chrome 9-10和Safari 5在支持CSS财产方面的一些webkit不一致，值得注意。
具体来说，Chrome 9和10在设置占位符样式时不支持背景色、边框、文本装饰和文本转换。
这里是完整的跨浏览器比较。
：：占位符{颜色：红色；}<input-type=“text”placeholder=“Value”>
