css - css - Firefox上的占位符文本颜色

Question

我在表单字段中有一个placeholder文本，我似乎无法将颜色更改为，但仅在 Firefox 上出现。Chrome 浏览器好像没问题。inputwhitegrey

当您在字段中键入正确的颜色时，它只是placeholder不响应的初始颜色。

任何帮助将不胜感激，谢谢。

CSS：

input#myinput::-webkit-input-placeholder {
    color:#FFF; background-color:#CCC; 
}
input#myinput::-moz-placeholder { 
    color:#FFF; background-color:#CCC;  
}
input#myinput:-moz-placeholder { 
    color:#FFF; background-color:#CCC; 
}
input#myinput::-ms-input-placeholder { 
    color:#FFF; background-color:#CCC; 
}   /* IE10+ */

input[type="text"]{
    width:170px; height:16px; padding:12px 5px; border:none; 
    color:#FFF; font:14px/14px 'Arial', Helvetica, sans-serif; 
    text-align:center; background-color:#CCC;
}

这是我的小提琴

Answer 1

添加opacity: 1到 Firefox 占位符。

查看更新的小提琴

Answer 2

//PLACEHOLDER EXAMPLE

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #666;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #666;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #666;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:    #666;
}

Answer 3

尝试

::-webkit-input-placeholder {
   color: #fff;
}

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

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

:-ms-input-placeholder {  
   color: #fff;  
}