css - 更改 Material slider 拇指大小

Question

所以我在这个元素中使用了 Mat Slider 并在它的拇指上显示文本值，但拇指尺寸对于我的文本来说太小了! 我找了很多方法来改变拇指的大小，但我什么也没找到! 我在 CSS 方面不是那么好，所以我不能乱用它来尝试让它发挥作用!你能帮我么 ？

编辑:

我希望这个词适合拇指

Answer 1

我现在遇到了这个确切的问题，经过一番研究后，我认为我有一个比较不错的解决方案 您可以使用::ng-deep 定位垫 slider 的拇指，这样代码看起来像

::ng-deep .mat-slider-wrapper {

  .mat-slider-thumb-container {
    .mat-slider-thumb-label {
      width: 50px;
      height: 50px;
      top: -62px;
      right: -25px;
    }
  }
}

宽度和高度可以从默认值 28px 更改为您想要的值

顶部和右侧有点不同，因此默认右侧为 -14px，即 -(1/2) * 宽度，因此您可以使用它来计算您的右侧。顶部有点不同。默认顶部是 -40px 所以我只是添加 -(height - defaultHeight) 并得到 -62，但是当用更大的高度值测试它时它没有像我预期的那样工作所以修改他的顶部直到你得到所需的位置。