如何更改Angular 5材质输入占位符? [英] How to change Angular 5 Material input placeholder?
本文介绍了如何更改Angular 5材质输入占位符?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
如何更改角度/材质输入占位符上的占位符颜色?
<mat-form-field>
<input matInput placeholder="Name">
</mat-form-field>
解决方案
要更改占位符的颜色,请覆盖.mat-form-field-placeholder的color属性,例如:
::ng-deep .mat-form-field-placeholder{
color:red;
}
::ng-deep .mat-focused .mat-form-field-placeholder{
color:red;
}
要更改下划线的颜色,请执行以下操作:
::ng-deep .mat-form-field-underline .mat-form-field-ripple{
background-color:red;
}
::ng-deep .mat-form-field-underline{
background-color:red;
}
这很完美. 演示: https://plnkr.co/edit/yF4kXJ500YzefLOnLKNe?p=preview >
How do you change the placeholder colour on a angular/material input placeholder?
<mat-form-field>
<input matInput placeholder="Name">
</mat-form-field>
解决方案
To change the color of placeholder, override the color property of .mat-form-field-placeholder like:
::ng-deep .mat-form-field-placeholder{
color:red;
}
::ng-deep .mat-focused .mat-form-field-placeholder{
color:red;
}
To change the color of underline:
::ng-deep .mat-form-field-underline .mat-form-field-ripple{
background-color:red;
}
::ng-deep .mat-form-field-underline{
background-color:red;
}
This works perfect. Demo: https://plnkr.co/edit/yF4kXJ500YzefLOnLKNe?p=preview
这篇关于如何更改Angular 5材质输入占位符?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文