активная кнопка не должна менять цвет при наведении

Question

Я отдельно установил функцию наведения и активную функцию, в которой цвет будет меняться, когда я наведусь на меню в навигации

/* Change the color of links on hover */
nav .nav > li > a:hover {
  background-color: peachpuff;
  color: black;
}

/* Add a color to the active/current link */
.active {
  background-color: darkslategray;
  color: snow;
}

<nav>
  <ul class="nav navbar-nav menu">
    <li class="active"><a href="#Fashion">Fashion</a></li>
    <li><a href="#StyleHunter">StyleHunter</a></li>
    <li><a href="#Lifestyle">Lifestyle</a></li>
    <li><a href="#Celebrity">Celebrity</a></li>
    <li><a href="#Videos">Videos</a></li>
    <li><a href="#Interviews">Interviews</a></li>
  </ul>
</nav>

, а также изменяется цвет для меню, которое установлено активным.Но опять же, когда я нахожусь над активной кнопкой, цвет меняется с активного на зависание.Как мне это остановить?

Answer 1

Попробуйте:

.nav>li:not(.active)>a:hover {
  background-color: peachpuff;
  color: black;
}

Answer 2

Попробуйте этот код CSS

/* Change the color of links on hover */
.nav>li>a:hover {
  background-color: peachpuff;
  color: black;
}

/* Add a color to the active/current link */
.nav li.active a {
  background-color: darkslategray;
  color: snow;
}

Я надеюсь, это поможет вам