Html CSS类冲突

我使用自己的自定义样式表开发网站，但后来决定改用引导。 我的问题尤其是一个相互冲突的类。我有一个HTML元素

<div class="dashboard-stat blue">

但是，我有两个CSS类叫做blue：一个定义为.blue，另一个定义为.dashboard-stat.blue

我希望使用后者，但是，当我打开页面并使用inspect元素时，我发现两者都使用了，但是.blue类是在.dashboard-stat.blue类之上使用的

---

有没有办法只使用更具体的类？我还不想删除我的旧类，因为我想一次只修改一个样式。

您可以使用

.blue:not（.dashboard stat）

（以及当前的

.dashboard-stat.blue

）。虽然这在IE中不起作用，但您可以添加一个！如果需要，请将重要信息添加到类属性中。通常情况下，我只建议将此作为最后手段，因为它可能会使你的生活在未来变得困难，但这似乎是一个适当的情况

.blue {color:#00f!important;}

---

祝你好运

我已经考虑过使用它，但是我必须对引导库中的大多数类进行更改（可能会很广泛）

。dashboard-stat.blue

不是另一个类

。blue

：它是同一个类。可能您指的是选择器（样式表中

{

之前的部分）或整个规则（选择器，

{

和

}

后面以及两者之间的所有内容）？它们是两个不同的类，具有选择器

.blue

和

.dashboard-stat.blue

。此外，在检查元素时，您看到两个规则都适用，因为两个选择器都匹配此元素及其类。但这并不是说每个声明（属性和值）应用。如果一个属性只在一个规则中找到，那么它就会应用。如果在两个规则中都找到了它，那么只有具有最特定选择器的一个才会应用。这是两个不同的规则，具有两个不同的选择器。一个规则的选择器仅由1个类组成。

。blah

，另一个规则的选择器由相同的类组成。

。blah

和另一个

.other

，它将只匹配具有这两个类的HTML元素。后一个选择器可以编写为

.blah.other

或

.other.blah

。但这两个规则都适用于本例，问题是如何只应用更具体的一个