更改垫子滑块的颜色

Question

我目前正在学习角度，我遇到了一个我确信很容易解决的问题，但我一直无法找到答案。

我的项目中有以下代码：

<mat-slider step="10" [value]="80" thumbLabel (change)="updateValue($event)" class="selector"></mat-slider>

目前，选择器线和拇指显示为黄色，这似乎是默认颜色。

谁能建议我需要做什么来改变滑块和拇指的颜色？

我已在 scss 文件中尝试了以下操作，但无法进行任何更改：

.mat-slider-thumb {
    border-color: red;
    background-color: blue;
}

.mat-slider {
    border-color: red;
    background-color: green;
}

上面唯一有效的是将背景颜色更改为绿色，这会更改整个元素的背景颜色。

Answer 1

这就是我需要在主题.scss 文件中将其全部变为红色的内容

.mat-accent .mat-slider-track-fill {
        background-color: red !important;
    }

.mat-slider-thumb-label {
        background-color: red !important;

    }

.mat-slider-thumb {
        background-color: red !important;
    }