Twitter Bootstrap - 单击时导航栏链接颜色更改

Question

我正在使用最新版本.

在我的导航栏中,我有:

<div class="collapse navbar-collapse" id="topnav-navbar">
<ul class="nav navbar-nav navbar-right">
        <li><a href="http://localhost/anything">Text</a></li>
</ul>

我想更改导航栏背景颜色和链接颜色.

我创建了以下Sass代码(SCSS语法).

.navbar {    
  background: #2C3E50;
  .navbar-nav li a {
    color: #eee;
    &:hover {
      color: #18BC9C;
    }
  }
}

它工作得很好,但当我点击链接(而不是悬停)一瞬间我得到我的链接灰色与边框/框阴影(悬停和一切看起来应该如此).

问题是 - 用什么类去除边框/阴影并使用我定义的颜色？我已经尝试了一段时间并没有取得任何成果.我真的很难猜出要用什么类来实现我想要的效果.

Answer 1

你需要包括:focus,:active也喜欢这样:

.navbar {    
  background: #2C3E50;
  .navbar-nav li a {
    color: #eee;
    &:hover, &:focus, &:active {
      color: #18BC9C;
      background-color: transparent;
      -webkit-box-shadow: none;
      -moz-box-shadow: none;
      box-shadow: none;
    }
  }
}