如何改变md-slider ticks的高度？

Question

我在md-slider中设置了tick-interval="1"，我想设置tick的高度来创建滑块的比例。

如何更改此高度？

我发现当我使用'ng-deep'

添加规则时

.mat-slider-horizontal .mat-slider-ticks {
   height: 5px !important;
}

最后一个刻度改变它的高度，我不知道如何改变其他人的身高。

Answer 1

在SCSS中写下来，这是如果您希望刻度线高10px：

.mat-slider-horizontal{

  .mat-slider-wrapper {
    height: 10px !important;

    &:after {
      margin-top: -4px;
      height: 10px !important;
    }
  }

  .mat-slider-ticks-container {
    margin-top: -4px;
    height: 10px !important;
  }

  .mat-slider-ticks {
    height: 10px !important;
  }

  .mat-slider-thumb-container {
    margin-top: -4px;
  }
}