css - 似乎无法更改链接的颜色

Question

这是问题的截图:

注意我们在 stalk 页面上。我编写的 CSS 应该会更改事件页面的颜色。这是 CSS:

#nav {
    border-top:10px solid #A7C1D1;
    height:45px;
    padding-left:100px;
    padding-top:20px;
    margin-left:0;
    color:#000;
}

  #nav a {
    color:#000;
    text-decoration:none;
  }

  #nav a:visited {
    color:#000;
  }

  #nav a:hover {
    color:#93AFBF;
  }

  #nav .active {
    color:#93AFBF;
  }

之前，我使用 #nav .active 的 CSS 在事件页面周围创建边框。这行得通，当我在/stalk 页面上时，我可以看到“stalk”一词周围的边框。但这一次，我决定只改变单词的颜色。这就是我遇到问题的地方。

这是为页面呈现的 HTML:

  <div id="nav"> 
    <a href="/">home</a> &middot; <a href="/stalk" class="active">stalk</a> &middot; <a href="#">link3</a> &middot; <a href="#">link4</a> 
  </div>

如果我去掉 #nav a:visited 的 CSS，那么 #nav .active 的 CSS 就可以工作，但是现在访问的链接在我需要的时候是蓝色的保持黑色。

Answer 1

使用

#nav a.active {
    color:#93AFBF;
  }

#nav a:visited 有更高的 specificity ^{w3 specs}比 #nav .active 并因此得到应用。