小编mgr*_*rom的帖子

Angular Material 文档中有一些我想重用的内容，并且我想以正确的方式进行操作： https: //material.angular.io/components/categories 我希望在顶部栏上有具有相同 div 的按钮.mat-button-focus-overlay 其中有：

.mat-button-focus-overlay {
   background-color: rgba(0,0,0,.12);
}

无论我做什么，我得到的都是这样：

.mat-button-focus-overlay {
   background-color: rgba(63, 81, 181, 0.12);
}

这使得我的颜色与条形相同，因此悬停时的叠加层不可见。示例： https: //stackblitz.com/edit/angular-lwmxw7

如何以正确的方式去做呢？我不想使用任何技巧，只想使用最佳实践:)

编辑：

当我将其放入组件的 scss 文件时，我发现了一些奇怪的东西：

body mat-toolbar.mat-toolbar button.mat-button div.mat-button-focus-overlay {
    background-color: rgba(0,0,0,0.12);
}

它不起作用，看起来它甚至不存在于浏览器中的样式列表中（？），但是移至 style.scss 的相同代码就像魅力一样......有人知道为什么吗？