css - Bootstrap3 悬停颜色在单击后禁用

Question

我正在使用 bootstrap3 dropdown-menu。一旦我打开和关闭包含子类别的菜单，它的悬停颜色就会被禁用。

例如，

<ul class="nav navbar-nav">
  <li><a href="#"> item1 </a></li>
  <li><a href="#"> item2 </a></li>
  <li><a href="#" class="dropdown-toggle" data-toggle="dropdown"> submenu </a></li>
    <ul class="dropdown-menu">
      <li><a href="#"> sub item1 </a></li>
    </ul>
</ul>

我为此定制的 CSS，

.menu ul li a:hover {
background: #6f9be2;

当我检查浏览器上的开发者工具时，它被禁用了。我怎样才能解决这个问题？提前致谢!

Answer 1

使用:

ul li a:hover {
   background-color: #6f9be2 !important;;
}

 ul li a:hover {
background-color: #6f9be2 !important;;
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<ul class="nav navbar-nav">
  <li><a href="#"> item1 </a></li>
  <li><a href="#"> item2 </a></li>
  <li><a href="#" class="dropdown-toggle" data-toggle="dropdown"> submenu </a></li>
    <ul class="dropdown-menu">
      <li><a href="#"> sub item1 </a></li>
    </ul>
</ul>