css - 如何在所有浏览器中设置占位符属性的样式？

Question

我有这样的元素<input type="text" placeholder="lorem ipsum">。

如何placeholder在 CSS 中设置此属性的样式，使其适用于所有浏览器？

Answer 1

输入中的占位符文本（在目前实现它的浏览器中）是浅灰色的。要设置样式，您需要供应商前缀 CSS 属性。

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

:-moz-placeholder { /* Firefox 18- */
   color: red;  
}

::-moz-placeholder {  /* Firefox 19+ */
   color: red;  
}

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

您也可以检查这个非常相似的问题：

• 使用 CSS 更改 HTML5 输入的占位符颜色