如何在CSS3中更改mat-checkbox background-color？角度6

Question

我需要使用mat-ripple use class =“ matCheckboxClass”

更改背景

HTML：

<mat-checkbox class="matCheckboxClass"></mat-checkbox>

CSS3：

.matCheckboxClass .mat-checkbox-checked
.mat-accent.mat-checkbox-background, .mat-checkbox-indeterminate.mat-accent 
.mat-checkbox-background {
background-color: rgb(27, 142, 241) !important;
}

.matCheckboxClass .mat-ripple-element  {
 background: rgba(27, 142, 241, .4) !important;
 }

注意：:: ng-deep将更改所有mat-checkbox，我需要更改特定的mat-checkbox。

Answer 1

you can try this:

:host /deep/{
    .matCheckboxClass .mat-checkbox-checked
    .mat-accent.mat-checkbox-background, .mat-checkbox-indeterminate.mat-accent 
    .mat-checkbox-background {
    background-color: rgb(27, 142, 241) !important;
}

 .matCheckboxClass .mat-ripple-element  {
     background: rgba(27, 142, 241, .4) !important;
  }
}