可以使用 ng-deep 在全局样式表中定义自己的样式类,然后将该类应用于 mat-horizontal-stepper 上。 ng-deep 可以使样式被应用于组件内部。
示例:
在 styles.css 文件中定义一个样式类,将该类应用于 mat-horizontal-stepper 上:
.custom-stepper {
.mat-step-header {
background-color: green;
}
.mat-step-header.mat-step-header-selected {
background-color: red;
}
}
::ng-deep .custom-stepper .mat-horizontal-stepper-header {
display: flex;
justify-content: space-around;
height: 70px;
}
在组件中引入该样式表: