如何更改 angular materail 轮廓边框的大小？

Question

我正在使用 angular 材料。我不知道如何在对焦时更改边框的大小。我不想看到厚度。

  <form class="example-form">
  <mat-form-field  appearance="outline" class="example-full-width">
    <input 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>

Answer 1

Angular material 使用起来相当棘手（至少在开始时）。理想的解决方案是创建适合您需要的自定义主题。您可以在此处查看操作方法：

https://material.angular.io/guide/theming

如果您想要快速修复，一个简单的方法是在 CSS 文件中使用 ::ng-deep，例如：

::ng-deep .material-class {
   border: none;
}

::ng-deep 已被弃用，它很快就会停止工作。您真的应该为您的应用程序创建一个特定的主题。