首页 > 解决方案 > CSS :hover 伪类在我的代码中不起作用

问题描述

我使用悬停伪类来改变锚元素的颜色,<a>但它的结果不是我想要的。它不工作。请帮帮我。非常感谢。JSFiddle在这里-http: //jsfiddle.net/km9287u3/6/

标签: htmlcss

解决方案


你有一个具体的问题。div#nav a比 更具体a:hover。使您的悬停规则更具体,如下所示。

div#nav a {
  margin-left: 30px;
  font-size: 1.2em;
  font-weight: 600;
  font-family: sans-serif;
  color: #444;
  text-decoration: none;
}

div#nav a:hover {
  color: brown;
}
<header>
  <div id="logo">

  </div>
  <div id="nav" class="navigation">
    <a id="home" href="Ajax_Load_Content_to_Page.html">HOME</a>
    <a id="route" href="Ajax2.html">ROUTE</a>
    <a id="toys" href="Ajax3.html">TOYS</a>
  </div>
</header>


推荐阅读