css - Angular Material design 复选框黑色前景色（符号颜色）

Question

我<mat-checkbox> ... </mat-checkbox>在我的应用程序中使用了一个组件，我需要将符号的颜色（“勾号”✓）设置为黑色。我可以通过 css 设置背景颜色，但对于“前景”颜色没有任何作用。

代码：

my.ts
          <mat-checkbox name="{{field.name}}"
                        [ngModel]="field.valueChecked"
                        ...
                        [ngClass]="{
                 'mandatory': field.mandatory == true
                 ,'optional': field.mandatory == false
                 ,'checkbox' : true}"
                 >
          </mat-checkbox>


my.css
    .checkbox {
        background-color: #3197ee !important;
        color: #050911 !important;
    }

欢迎任何如何更改颜色的解决方案！

标签： cssangulartypescriptangular-material

Answer 1

试试这个

.mat-checkbox-checkmark-path {
    stroke: #000 !important;
}

或者

/deep/ .mat-checkbox-checkmark-path {
    stroke: #000 !important;
}