如何覆盖材质CSS样式？

Question

我使用Angular Material 2。

实质CSS中有一种CSS样式：

.mat-radio-button.mat-accent .mat-radio-inner-circle {
  background-color: #fff;
}

我试图在自定义CSS文件中覆盖它，例如：

.mat-radio-button.mat-accent .mat-radio-inner-circle {   background-color: red !important; }

我也试过这个：

/deep/ .mat-radio-button.mat-accent .mat-radio-inner-circle {
  background-color: red !important;
}

它不起作用，如何正确执行此操作以及在何处进行？

Answer 1

在 angular 配置文件中，您需要在实现样式后导入您的样式

Answer 2

您可以在全局样式表（style.scss）或任何未封装的样式表中进行操作。

若要覆盖，请通过在浏览器中检查HTML元素来选择选择器，然后覆盖所需的属性。

如果仍然失败，则可以!important用来强制应用样式。

请记住也要在angular.json文件中订购样式表导入（感谢@SurenSrapyan提醒我）