Link 整体颜色 div

Question

所以我有一个 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>

还有几张悬停前后的截图：

Answer 1

您需要像这样定位锚标记的不同状态：

.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;
}

Answer 2

这 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;
}

Link 整体颜色 div

Link colors on overall div

html

css

anchor