Por que o Firefox está alterando minhas cores de entrada/espaço reservado?

Question

Eu tentei de tudo para fazer com que o Firefox use a cor que estou especificando como cor para o espaço reservado em meus formulários. Incluindo o uso :-moz-placeholder No meu CSS e tudo mais, a cor resultante nunca é o que eu especificar.

Estou ciente de que o Firefox usa um cinza claro a sua cor padrão/espaço espaço reservado, mas por que existe uma opção para alterá -lo se não mudar completamente?

Aqui está um codepen que fiz para demonstrar, incluindo todos os CSs específicos do Firefox:

Velho: http://codepen.io/jtlr/pen/bpjft

Novo: http://codepen.io/jtlr/pen/ekjhh

Answer 1

Aqui está o que o estilo de espaço reservado padrão no Firefox é:

input::-moz-placeholder,
textarea::-moz-placeholder {
  opacity: 0.54;
}

sem estilos de cores (referência é http://hg.mozilla.org/mozilla-central/file/a07ebef20e7/layout/style/forms.css#l160). Isso é importante, porque dessa maneira se você acabou de definir color e background Em sua opinião, e não tem nenhum estilo de espaço reservado especial, ele captará a cor que você definirá, mas apenas a parecerá mais desbotada.

Portanto, se você deseja restabelecer completamente o espaço reservado, defina sua opacidade como 1.

Answer 2

Firefox 19+ requer 2 colonos ..::

Então use ::-moz-placeholder

O pseudo-elemento:

em oposição a :-moz-placeholder

O: -Moz-Place-tholdder Pseudo-Class será preterido a favor do elemento:

Exemplo de codepen de trabalho - FF apenas.

::-moz-placeholder {
  color:red;
}

Além disso, este é um seletor, em oposição a uma propriedade. Portanto,

p { :-moz-placeholder: #000000; }

Está incorreto.