Html 单击后链接颜色保持蓝色，直到单击视口中的其他位置

在我的CSS中，我尝试使用

：link

，

：visted

，

：hover

，和

：active

选择器将导航栏a元素的字体颜色设置为黑色，但没有任何改变。我想我的标题已经足够清楚地说明了我的问题，但这里有一个指向我的网站的链接，我正试图解决这个问题：

基本上，如果你试着点击导航栏中的一个链接，它会改变，它会暂时变成蓝色。如果单击视口中的其他任何位置，蓝色将变回我想要的黑色。关于是什么导致了这种情况，有什么建议吗

这就是我在HTML中对导航栏所做的一切，其余的都是用CSS完成的：

            <div id="navbar" class="navbar navbar-default navbar-fixed-top">
            <nav>
                <ul id="navlist">
                    <li class="navitem"><a class="link" ui-sref="home">Home</a></li>
                    <li class="navitem"><a class="link" ui-sref="about">About</a></li>
                    <li class="navitem"><a class="link" ui-sref="contact">Contact</a></li>
                </ul>
            </nav>
        </div>

主页
关于
联系

蓝色边框来自于在bootstrap.css中围绕第1104行定义的

a:focus

a:focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}

覆盖css中导航的

a:focus

属性应该可以解决问题

color: whatever you want;
outline: none;

---

存在CSS冲突。要调试CSS，您可以通过按F12键或在Mozilla Firefox中使用firebug来尝试浏览器内置的开发工具

因此，要解决这个问题：

.navitem a:focus{color:#000;}

---

哦，我知道你有什么问题了。删除了我的答案，因为它不充分。编辑：发布新的答案太棒了！我不知道a：专注是一件事。没有在我浏览过的任何网站上找到它。下次我会检查内置的开发工具来调试我的CSS！