javascript - 为什么 Angular UI 按钮在 Chrome 中的焦点边框与在 IE 中的焦点边框不同？

Question

谁能告诉我为什么按钮焦点边框在 IE11 中默认呈现为黑色虚线边框，而在 Chrome 中呈现为蓝色实线边框？如果你去 http://angular-ui.github.io/ 就可以看到这个并使用 IE11 和 Chrome 在站点/代码按钮上切换。

我已经尝试了各种覆盖，例如 -webkit-appearance:none 等，但都无济于事。这是一个 AngularUI 错误，还是每个人都知道并且一直在解决的浏览器怪癖，如果我希望外观统一，我需要特殊情况？

Answer 1

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

如果你想覆盖它，那么你可以编写自己的焦点样式。所以对于这个特定的按钮，你可以使用:

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

或者，如果您只想定位页面上的所有 anchor ，则使用

a:focus{
    outline: 0;
}