html - css 将 href 参数放在整个 div 上，而不仅仅是文本上

Question

我正在尝试使用 CSS 将整个 div 放入 href 参数中，但是当我想为我的链接赋予颜色时它不起作用。

.nav_link a {color:#c2c2c2;text-decoration:none;}
.nav_link a:visited {color:#c2c2c2;}
.nav_link a:hover {color:#b1b1b1;}

<a class="nav_link" href="#"><div class="nav_home">Link 1</div></a>
<a class="nav_link" href="#"><div class="nav">Link 2</div></a>
<a class="nav_link" href="#"><div class="nav">Link 3</div></a>
<a class="nav_link" href="#"><div class="nav">Link 4</div></a>

Answer 1

从 .nav_link a:hover 和 a_visited 中删除一个标签，因为 .nav_link 是您的 a 标签的一个类 =)

.nav_link {
  color:#c2c2c2;
  text-decoration:none;
}
.nav_link:visited {
  color:#c2c2c2;
}
.nav_link:hover {
  color:#b1b1b1;
}

<a class="nav_link" href="#"><div class="nav_home">Link 1</div></a>
    <a class="nav_link" href="#"><div class="nav">Link 2</div></a>
    <a class="nav_link" href="#"><div class="nav">Link 3</div></a>
    <a class="nav_link" href="#"><div class="nav">Link 4</div></a>