将div设为链接并在悬停时更改内容

Question

我正在尝试使div成为链接，并且此方法有效，不确定我是否正确完成了操作。但我也希望div中的类型更改颜色。谁能帮我，如果您能解释一下，我会很高兴的：D尝试学习:)

这是HTML

    <div class="song_feature">
        <a href="#"></a>
        <div class="song_feature_content">
            <div class="break32"></div>
            <h1>1</h1>
            <div class="break10"></div>
            <div class="break45"></div>
            <h2>Lorem ipsum title</h2>
            <div class="break10"></div>
            <p>lorem ipsum</p>
        </div>
    </div>

和CSS

.song_feature:hover {
background-color: #B5B5B5;
cursor: pointer;
}

Answer 1

只需在CSS中尝试一下：

.song_feature:link {
  background-color: #000;
  cursor: pointer;
}
.song_feature:visited {
  background-color: #000;
  cursor: pointer;
}
.song_feature:hover {
  background-color: #B5B5B5;
  cursor: pointer;
}
.song_feature:active {
  background-color: #000;
  cursor: pointer;
}

在鼠标悬停在其上方之前，背景颜色将为黑色。只需相应地更改颜色。