如何将引导微调器的颜色更改为文本颜色实用程序以外的颜色？

Question

我在网页中包含一个 Bootstrap-4 微调器(如此处所述(，但似乎只能使用文本颜色实用程序中的颜色(主要、警告、成功...(，这是非常有限的。我希望能够将网页的主题以及微调器的颜色更改为不是文本颜色实用程序之一的颜色。是否有可能做到这一点以及如何做到这一点？

Answer 1

你可以做的一件事是，

<div class="spinner-border" role="status" style="color: darkgreen">
  <span class="sr-only">Loading...</span>
</div>

Answer 2

您可以将引导微调器的颜色更改为您喜欢的任何颜色。您只需要设置微调器的 color 属性。

.text-red {
  color: red;
}
.text-blue {
  color: blue;
}
.text-orange {
  color: orange;
}

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet"/>
<div class="spinner-border text-red" role="status">
  <span class="sr-only">Loading...</span>
</div>
<div class="spinner-border text-blue" role="status">
  <span class="sr-only">Loading...</span>
</div>
<div class="spinner-border text-orange" role="status">
  <span class="sr-only">Loading...</span>
</div>