为什么棱角UI按钮在Chrome中有一个与IE中不同的焦点边框？

Question

有人能告诉我，为什么在IE11中，按钮焦点边框默认使用黑色虚线边框，而在Chrome中则是蓝色实心边框？如果您转到带有http://angular-ui.github.io/和Chrome的站点/代码按钮上的http://angular-ui.github.io/和选项卡，就可以看到这一点。

我尝试过各种重写，如-webkit-外观:无等，但没有任何效果。这是一个AngularUI错误，还是每个人都知道并一直在努力解决的浏览器怪癖，如果我想让外观变得统一的话，我需要特例吗？

Answer 1

当您在按钮上选项卡时，您正在应用元素的:focus样式。查看正在使用的样式表，我看不到它的任何自定义样式，因此浏览器提供它的默认焦点样式。

如果您想要覆盖这一点，那么您可以编写自己的焦点样式。因此，对于这个特定的按钮，您可以使用：

a.btn.btn-primary.btn-large:focus{
    outline: 0;
    /* add other styling to it */
}

或者，如果希望只针对页面上的所有锚点，则请使用

a:focus{
    outline: 0;
}

Answer 2

角是添加虚线在这一场合-删除，这在你的CSS；

.btn-group > .btn:hover, .btn-group > .btn:focus, .btn-group > .btn:active, .btn-group > .btn.active {
         outline: 0;
}