角材料滑块奇怪地出现

Question

我不确定滑块发生了什么。

[]

.big-container {
  display: block;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 10px;
  margin-bottom: 10px;
}

.question {
  display: block;
  width: 100%;
  background-color: rgba(0, 255, 242, 0.507);
}
.answer {
  display: block;
  background-color: #eee;
  padding-top: 5px;
  margin-bottom: 10px;
  color: #000088;
  size: 10px;
}

<div class="big-container">
  <label class="question">Tolerance (%):
    <div class="answer">
      <div><mat-slider thumbLabel tickInterval="10" min="0" max="100" step="1" value="1"></mat-slider></div>
    </div>
  </label>
</div>

我希望拥有与https://material.angular.io/components/slider/overview上的滑块示例类似的UI 我该怎么办？我看不到任何不可用的依赖关系，并且滑块可以工作，但显示效果不佳。

Answer 1

角材安装未正确安装。因此，没有安装主题。我在使用npm install -g @ angular / cli之后使用ng add @ angular / material来获取cli。我选择了一个主题，它正确显示了。