更改 md-autocomplete 的占位符文本的 css [英] Change css of placeholder text of md-autocomplete

问题描述

我使用 Angular Material 1.1 版

I use Angular Material version 1.1

我想更改 md-autocomplete 组件的占位符文本的样式.但是，我无法选择占位符作为单独的元素来调整其样式.

I want to change the style of placeholder text of md-autocomplete component. However, i could not select the placeholder as an apart element to play with its styling.

这里有一个 codepen 来说明问题.

Here you see a codepen to illustrate the problem.

我尝试了以下口述代码，但它们不起作用

I tried the following dictating codes but they did not work

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

有什么办法吗?

推荐答案

要更改元素内的占位符，伪元素 placeholder 应该是 user.

To change the placeholders within an element, the pseudo element placeholder should be 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:

Thanks to @Rayon Dabre:

这篇关于更改 md-autocomplete 的占位符文本的 css的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！