如何 - 更改占位符颜色

了解如何使用 CSS 更改占位符属性的颜色。

占位符颜色

使用输入元素并添加占位符属性：

在大多数浏览器中，占位符文本是灰色的。要更改此设置，请使用以下样式设置占位符::placeholder选择器。请注意，Firefox 为占位符添加了较低的不透明度，因此我们使用opacity: 1解决这个问题。

::placeholder {
color: red;
opacity: 1; /* Firefox */
}

::-ms-input-placeholder { /* Edge 12 -18 */
color: red;
}

提示：在我们的 CSS 参考中了解有关 ::placeholder 选择器的更多信息：CSS::占位符选择器。