在Edge Browser上,如何使用CSS更改输入占位符文本颜色？

Question

在Edge Browser上,我无法更改输入占位符颜色.

:-ms-input-placeholder不工作但在IE 10&上工作正常IE 11.

input:-ms-input-placeholder {
    font-style:italic;        
    color: red;
    background-color: yellow;
}

反正有没有使用CSS？

Answer 1

:: - webkit-input-placeholder(Chrome/Safari/Opera)

:-ms-input-placeholder for IE.

:: - ms-input-placeholder for Edge(也支持webkit前缀)

请注意双冒号语法

就我而言,它最终使用input :: - ms-input-placeholder {color:myColor;}进行边缘处理.但它没有输入:: - ms-input-placeholder,输入:-ms-input-placeholder {color:myColor;} (5认同)

Answer 2

我想在上面的@Paulie_D的答案中回答@ ken的评论.

这有效: input[type="text"]::-ms-input-placeholder { color: #000; }

这不是: input[type="text"]::placeholder, input[type="text"]::-ms-input-placeholder { color: #000; }

我不确定为什么,但肯定看来-ms-input-placeholder伪元素只有在与其他指令分开时才有效.

Edge不会占用::占位符有效的CSS并删除整个规则.因此,即使你把有效的类说成`.text-white,输入[type ="text"] :: placeholder`,.text-white也不会为Edge应用它,而对于所有其他浏览器都没有.它可以破坏Edge中的网站. (4认同)

Answer 3

对于当前版本的Microsoft Edge浏览器,占位符无法正常工作.看看这个问题Microsoft Edge占位符错误.如果占位符不可见,请尝试删除position: relative和:-webkit-input-placeholder不透明度.