Javascript 仅在选项卡上显示元素轮廓，而不在单击时显示

如果我通过下拉菜单进入“和”选项卡，我会得到具有轮廓的元素，这对于可访问性来说是完全好的：

但是如果我点击它，我就看不到大纲：

我曾尝试通过仅使用pseudo-class:focus、excluiding:active来实现这一点，但它仍然不起作用：

a {
  color: @brand-link;

  &:focus:not(:active) {
    outline: -webkit-focus-ring-color auto 5px;
  }
  &:active {
    outline: none;
  }

}

有人知道如何严格地只为选项卡导航而不为单击的元素实现大纲吗

顺便说一下，我用的更少了

这里是一个示例，如果您单击它，它将勾勒出它的轮廓

gold

colored:

a：焦点{
外形：4倍纯金；
}
a:主动的{
大纲：无；
}

试试这个

a {
  color: @brand-link;

  &:focus {
    outline: none;
  }

}

试试这个

a {
  color: @brand-link;

  &:focus {
    outline: none;
  }

}

---

：active

是在单击时激发的伪类

a:link:active{outline:10px dotted #000;}

将准确显示此onclick
.

：link

表示尚未访问的元素

编辑：
解决方案是：

a:focus:not(:link:active) {  
outline: -webkit-focus-ring-color auto 5px;  
}

---

：active

是在单击时激发的伪类

a:link:active{outline:10px dotted #000;}

将准确显示此onclick
.

：link

表示尚未访问的元素

编辑：
解决方案是：

a:focus:not(:link:active) {  
outline: -webkit-focus-ring-color auto 5px;  
}

---

---

大纲：无？在ur css大纲中：无@皮特，是的，我已经试过了，但它不起作用。你可以提供html代码，这样你就不想显示大纲，或者你想显示它？你的问题和人们的评论是不同的观点。在Mozilla网站上点击该链接将导致另一个页面，因此在页面重新加载后，它没有必要显示任何大纲。
outline:none？在ur css大纲中：无@皮特，是的，我已经试过了，但它不起作用。你可以提供html代码，这样你就不想显示大纲，或者你想显示它？你的问题和人们的评论是不同的观点。在Mozilla网站上点击该链接会导致另一个页面，因此在页面重新加载后，它没有必要显示任何大纲。嗨，albert，谢谢你的回答。我想要的是，当你在某个元素上单击tab键以显示其默认大纲时，但点击后不显示此大纲实际上，您的答案似乎是使用链接解决了问题的解决方案这是有效的：
a:focus:not（：link:active）{outline:-webkit focus ring color auto 5px；}
这很疯狂，因为在我的头脑中它不应该工作。无论如何，这并不意味着我是对的。至少你得到了答案。我读了文档，上面写着“未访问的元素”，但它至少在chrome和FFox中工作：/Hi albert谢谢你的回答。我想要的是当你在元素上按tab键以显示其默认轮廓时，但点击后不显示此大纲实际上，您的答案似乎是使用链接解决了问题的解决方案这是有效的：
a:focus:not（：link:active）{outline:-webkit focus ring color auto 5px；}
这很疯狂，因为在我的头脑中它不应该工作。无论如何，这并不意味着我是对的。至少你得到了你的答案。我读了文档，它说的是未访问的元素，但它至少在chrome和FFox中工作：/这破坏了可访问性，因此没有回答作者的问题。看，这破坏了可访问性，因此没有回答作者的问题。看见