在活动链接上禁用悬停答案

【问题标题】：Disable hover on active link在活动链接上禁用悬停
【发布时间】：2019-04-07 03:18:55
【问题描述】：

我试图弄清楚如何不使用悬停覆盖活动链接。

<style>
.primary-nav-wrapper nav a:active, .primary-nav-wrapper nav .active>a  {
    border-bottom: 3px solid #4F579D;}
.primary-nav-wrapper nav a:hover:not([active]) {border-bottom: 3px solid #DFE1E5;}
</style>

【问题讨论】：

你能提供你的完整代码吗？

标签： hyperlink hover disable

【解决方案1】：

我没有你的代码，所以我无法为你提供最全面的帮助，但我会尝试。

我认为您的 CSS 存在根本问题。我想你想要这个：

悬停时，给 a 一个灰色边框。
如果处于活动状态，请给 a 一个蓝色边框。
如果有人悬停并激活 a，它应该仍然是蓝色。

如果这是您的问题，这里有一个工作代码：

.primary-nav-wrapper nav a:hover  {
    border-bottom: 3px solid #DFE1E5;
}
    
.primary-nav-wrapper nav a:hover:active {
  border-bottom: 3px solid #4F579D;
}

<div class="primary-nav-wrapper">
  <nav class="active">
    <a>test</a>
  </nav>
  <nav class="active">
    <a>test</a>
  </nav>
  <nav class="active">
    <a>test</a>
  </nav>
</div>

【讨论】：