我已经尽一切努力让 Firefox 使用我指定的颜色作为表单上占位符的颜色。包括:-moz-placeholder
在我的 CSS 和所有内容中使用,但结果颜色从来不是我指定的。
我知道 Firefox 使用浅灰色作为其默认输入/占位符颜色,但如果它没有真正完全改变它,为什么还有一个选项来改变它?
这是我制作的一个代码笔,用于演示包括所有 Firefox 特定的 CSS:
我已经尽一切努力让 Firefox 使用我指定的颜色作为表单上占位符的颜色。包括:-moz-placeholder
在我的 CSS 和所有内容中使用,但结果颜色从来不是我指定的。
我知道 Firefox 使用浅灰色作为其默认输入/占位符颜色,但如果它没有真正完全改变它,为什么还有一个选项来改变它?
这是我制作的一个代码笔,用于演示包括所有 Firefox 特定的 CSS:
Firefox 19+ 需要 2 个冒号..::
::-moz-placeholder 伪元素被引入以替代 Firefox 19 中已弃用的 :-moz-placeholder 伪类。
:-moz-placeholder 伪类将被弃用,取而代之的是 Firefox 19 中的 ::-moz-placeholder 伪元素。
工作 CodePen 示例- 仅限 FF。
::-moz-placeholder {
color:red;
}
除此之外,这是一个选择器,而不是属性。所以,
p { :-moz-placeholder: #000000; }
是不正确的。
以下是 Firefox 中默认的占位符样式:
input::-moz-placeholder,
textarea::-moz-placeholder {
opacity: 0.54;
}
完全没有任何颜色样式(参考http://hg.mozilla.org/mozilla-central/file/a07aebef20e7/layout/style/forms.css#l160)。这很重要,因为这样如果您只是设置color
并background
输入输入,并且没有任何特殊的占位符样式,它将获取您设置的颜色,但只会让它看起来更加淡化。
因此,如果您想完全重新设置占位符的样式,请将其不透明度设置为 1。