Как изменить цвет фона mat-checkbox в CSS3?Angular6

Question

Мне нужно изменить фон с использованием mat-ripple. 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;
  }
}