如何更改垫分隔器的颜色？答案

【问题标题】：How to change color for mat-divider?如何更改垫分隔器的颜色？
【发布时间】：2020-04-27 11:44:24
【问题描述】：

是否可以更改mat-divider 颜色？我尝试了以下方法，它没有工作

component.html

<mat-divider class="material-devider"></mat-divider>

component.scss

.material-devider {
    color: red
}

【问题讨论】：

【解决方案1】：

是的，你可以。

您需要在自己编写的 CSS 中否决 .mat-divider 类样式并更改 border-top-color 属性。

.mat-divider {
    border-top-color: rgba(0, 0, 0, 0.12);
}

是 Angular Material 的默认样式。

.mat-divider {
    border-top-color: red;
}

这应该足以改变它（如果你的 CSS 比 Material 的渲染晚）。否则，为您的 CSS 类添加更高的特异性会有所帮助 (f.e..mat-divider.mat-divider)。

【讨论】：

【解决方案2】：

要更改颜色 mat-divider，只需更改 .mat-divider 类的border-top-color 属性。

.mat-divider {
  border-top-color: red;
}

【讨论】：