角材料-如何更改垫子抽屉容器的背景颜色

Question

有角材料的mat-drawer-container具有默认的背景颜色，如..

.mat-drawer-container {
    background-color: #fafafa;
    color: rgba(0, 0, 0, 0.87);
}

我想将其更改为。

.mat-drawer-container {
    background-color: #dddddd;
}

我尝试过..

encapsulation: ViewEncapsulation.None

和important就像下面的示例一样

.mat-drawer-container {
    background-color: #dddddd !important;
}

背景颜色不会改变，它仍然是#fafafa

它适用于.mat-drawer，但不适用于mat-drawer-container

有什么想法吗？

Answer 1

不要覆盖现有的材料类-而是将自己的类应用于元素：

<mat-drawer-container class="red-container">
...
</mat-drawer-container>

并在该特定类上设置样式：

.red-container {
  background-color: red;
}

这可以避免:: ng-deep。