Question

当我这样做时，它有效：

.view-current-sales .col-first a {color:#66ff66;}

当我添加悬停时，它不再起作用

.view-current-sales .col-first a:hover {color:#66ff66;}

任何想法？

Answer 1

我认为你对a标签及其附带的悬停对应物混淆了一些东西。让我们用一个不同的例子快速分解它。

HTML：

<div class="nohover3">
    <a href="#"> Test 3 </a>
</div>

CSS：

.nohover3 a {
    color:#66ff66;
}
.nohover3 a:hover {
    color:blue;
}

现在，我假设您将这些标记包含在某种div或其他包含标记中以使其拥有自己独立的类。现在，这个HTML呈现一个带有两个CSS元素的标记。第一个CSS元素为标签赋予其起始颜色，这意味着它会自动以您在原始问题中提供的那种浅绿色开始。第二个元素为悬停提供了不同的颜色，在这种情况下，颜色从石灰绿色变为蓝色。

话虽如此，让我们看一下你的例子，但需要更多清理代码：

HTML

<div class="nohover2">
    <a href="#"> Test 2 </a>
</div>

CSS：

.nohover2 a {
    color:#66ff66;
}
.nohover2 a:hover {
    color:#66ff66;
}

在这种情况下，第一个和第二个元素都为a标签生成相同的颜色。这意味着标签开始时的颜色（灰绿色）与悬停在标签上的颜色（也是灰绿色）相同。这意味着无论是否悬停，它都保持相同的颜色。

为了描绘一幅更清晰的画面，这是一个代表我刚才所说的JsFiddle：

我提前为这些可怜的班级名人道歉，创造例子不是我现在的强项。

Answer 2

CSS使用点评系统来确定要使用的冲突样式。元素值1分，类值10分，ID值100分。

尝试在Chrome浏览器中使用“Inspect Element”或在其他浏览器类型中使用“Inspect Element”，它会告诉您其他样式是否得分更高，因此使用其悬停样式。

如果是这种情况，请尝试将a类的引用替换为：hover到id引用，以获得您希望使用的a：hover的更高分数。

可在此处找到一个不错的说明Points in CSS specificity

如果所有其他方法都失败，请尝试使用“！important”标记您的悬停样式，以确保使用该类型。