Html 链接整体div上的颜色

所以我有一个div，整个东西都是一个锚定标签，我试图控制颜色如何悬停，并得到不同的结果。希望我能用css来做这件事。正在发生的是悬停，一个文本改变，但另一个文本没有改变。但同时，文本装饰下划线仍然不同。只是希望即使在鼠标悬停时也保持黑色，但在鼠标悬停时，url下划线会显示在文本上

<style>
    .welTile > p:hover {
        color: black;
    }
</style>
<div class="col-md-4">
    <a href="#/mod1">
        <div class="welTile">
            <img src="assets/images/welcomeTile.png">
            <p>Module 1: Moneyball Concepts</p>
            <p>Learn the basic concepts you need to successfully complete the other 5 modules</p>
        </div>
    </a>
</div>

.welTile>p:悬停{
颜色：黑色；
}

以及悬停前后发生的两个屏幕截图：

---

您需要针对锚定标记的不同状态，如下所示：

.col-md-4 a {
    color: #000;
}
.col-md-4 a:hover {
    color: #000;
}
.col-md-4 a:focus {
    color: #000;
}
.col-md-4 a:active {
    color: #000;
}

---

这个CSS将使所有内容保持黑色

.col-md-4 a, .col-md-4 a:hover, .col-md-4 a:focus, .col-md-4 a:active {
    color: black;
    display:inline-block;
    text-decoration: none;
}

---

但是我想要文本装饰，只想要与文本相同的颜色。

a:hover，a:focus，a:active

没有任何作用，因为它们的特异性低于

。col-md-4 a

因为文本变成了石灰色，所以你有一个规则可以做到这一点。我们需要看到这条规则及其特殊性，才能知道如何推翻它。