Chrome：无法获取：焦点CSS应用于锚点

Question

我尝试将一些CSS用于：锚点上的焦点状态

，但没有取得多大成功

a:focus
{
    outline:1px black dotted;
}

是的，那很简单。

http://jsfiddle.net/b6dbuqqv/

但它不起作用。 （Windows 7，Chrome 36）

显然，当通过鼠标激活焦点时，它们似乎是为了摆脱焦点环而实现的。相反，通过键盘导航，它可以按预期工作。

有没有办法解决这个问题？感谢

Answer 1

似乎点击锚点并不会将焦点放在<a>上。因此，:focus伪类不适用。如果您将一个onfocus事件监听器附加到锚点，那么您将看到该事件未在点击时触发（尽管通过键盘导航，选项卡/班次+标签按预期工作）：{{3 }}

快速搜索Chromium的错误跟踪器产生http://jsfiddle.net/b6dbuqqv/1/，报告按下锚点上的鼠标键不会聚焦它。

解决问题的方法是使用:active伪类：

a:focus, a:active {
    outline: black dotted;
}

（顺便说一句，避免不必要地使用!important）