如何创建 - 更改占位符颜色
了解如何使用 CSS 更改占位符属性的颜色。
占位符颜色
亲自试一试 »步骤 1) 添加 HTML:
使用输入元素并添加占位符属性:
实例
<input type="text" placeholder="A red placeholder text..">
步骤 2) 添加 CSS:
在大多数浏览器中,占位符文本是灰色的。 要更改这一点,请使用非标准的 ::placeholder
选择器设置占位符的样式。 请注意,Firefox 为占位符添加了较低的不透明度,因此我们使用 opacity:
1 来解决此问题。
实例
::placeholder {
/* Chrome, Firefox, Opera, Safari 10.1+ */
color: red;
opacity: 1; /* Firefox */
}
:-ms-input-placeholder { /* Internet
Explorer 10-11 */
color: red;
}
::-ms-input-placeholder
{ /* Microsoft Edge */
color: red;
}
亲自试一试 »
提示:在我们的 CSS 参考中了解更多关于 ::placeholder 选择器的信息:CSS ::placeholder 属性。