Angular material 更改 mat-checkbox 内的刻度颜色
Angular material change tick color inside mat-checkbox
我正在尝试将 mat-checkbox 内的刻度颜色从白色更改为黑色，但我找不到刻度标记的 CSS class，有人帮忙吗？
在任何浏览器中使用 DevTools 和 select 您要修改的 HTML 元素，您会发现哪些 CSS 类 正在应用于此指定的 HTML元素.
在你的例子中，如果你进入 .mat-checkbox-background 你会看到复选图标是一个路径元素，它的颜色由笔触设置：#FFFFFF！重要； CSS 属性，因此您应该修改的 class 是 mat-checkbox-checkmark-path
::ng-deep .mat-checkbox-checkmark-path {
stroke: black !important;
}
您可以在 component.css 文件中使用上面的代码 检查
控制Angular Material元素颜色的正确方法是使用不同的调色板，但功能有限。如果你想要更多的控制，你可以添加自定义 CSS，在大多数情况下你需要使用 ::ng-deep 来强制应用你的样式。
我正在尝试将 mat-checkbox 内的刻度颜色从白色更改为黑色，但我找不到刻度标记的 CSS class，有人帮忙吗？
在任何浏览器中使用 DevTools 和 select 您要修改的 HTML 元素，您会发现哪些 CSS 类 正在应用于此指定的 HTML元素.
在你的例子中，如果你进入 .mat-checkbox-background 你会看到复选图标是一个路径元素，它的颜色由笔触设置：#FFFFFF！重要； CSS 属性，因此您应该修改的 class 是 mat-checkbox-checkmark-path
::ng-deep .mat-checkbox-checkmark-path {
stroke: black !important;
}
您可以在 component.css 文件中使用上面的代码 检查
控制Angular Material元素颜色的正确方法是使用不同的调色板，但功能有限。如果你想要更多的控制，你可以添加自定义 CSS，在大多数情况下你需要使用 ::ng-deep 来强制应用你的样式。