使用类在悬停时引导程序更改颜色

Question

在我的代码段中，如果您将鼠标悬停在文本上，则会将文本变为红色，而不是硬编码color:red我更喜欢使用Bootstrap的本机类text-danger。这可能吗？

＆＃13;

＆＃13;

.text-primary:hover {
  color: red !important;
}

＆＃13;

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">

<div class="text-primary">Hello World!</div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

<{1}}的引导程序的颜色为text-danger，并且它位于变量（custom property ）#dc3545中，因此您可以使用它。

这些是available variables

＆＃13;

＆＃13;

--red

＆＃13;

.text-primary:hover {
  color: var(--red) !important;
}

＆＃13;

＆＃13;

＆＃13;