首页 > 解决方案 > 如何更改 matinput 占位符的颜色?

问题描述

如何设置占位符的颜色?在堆栈溢出上发布的任何解决方案都不适合我。

::ng-deep input.mat-input-element {
    color: #ff884d;
    caret-color: #ff884d;
}
<form class="example-form">
    <mat-form-field class="example-full-width">
      <input [(ngModel)]="email" matInput placeholder="Email" [formControl]="emailFormControl">
      <mat-error *ngIf="emailFormControl.hasError('email') && !emailFormControl.hasError('required')">
        Please enter a valid email address
      </mat-error>
      <mat-error *ngIf="emailFormControl.hasError('required')">
        Email is <strong>required</strong>
      </mat-error>
    </mat-form-field>
  </form>

所有的css样式都被覆盖了,但是颜色是一样的。

标签: cssangular-material

解决方案


使用它来覆盖特定的组件输入占位符。

:host /deep/ mat-form-field-placeholder{
  color: #ff884d;
}

如果要在全局范围内覆盖样式。然后使用您的全局样式表使用重要关键字覆盖

mat-form-field-placeholder{
  color: #ff884d !important;
}

推荐阅读