更改md-autocomplete的占位符文本的css

Question

我使用Angular Material 1.1版

我想改变md-autocomplete组件的占位符文本的样式.但是,我无法选择占位符作为与其样式一起使用的分隔元素.

这里你可以看到一个codepen来说明问题.

我尝试了以下口述代码,但它们没有用

md-autocomplete{
  color: red !important;
}
md-autocomplete-wrap{
  color: red !important;
}
input{
  color: red !important;
}

有什么办法吗？

Answer 1

要更改元素中的占位符,伪元素placeholder应为user.

在这种情况下:

md-autocomplete input::-webkit-input-placeholder {
    color:red;
}
md-autocomplete input:-moz-placeholder { /* Firefox 18- */
    color:red;
}

md-autocomplete input::-moz-placeholder {  /* Firefox 19+ */
    color:red;
}

md-autocomplete input:-ms-input-placeholder { 
    color:red;
}

如何改变

伪元素

感谢@Rayon Dabre: