如何删除链接单击时的轮廓？答案

【问题标题】：How do I remove outline on link click?如何删除链接单击时的轮廓？
【发布时间】：2016-04-10 16:31:47
【问题描述】：

当我点击我网站上的链接时，它会像这样围绕链接创建一个大纲

我已经尝试添加：

a.image-link:focus { outline: 0; }

和

a {outline : none;}

但似乎没有什么能摆脱它。有没有办法去掉？

【问题讨论】：

也许是a:active{outline: 0;}
How can I remove the outline around hyperlinks images?的可能重复
请注意，这些轮廓对于某些残疾用户来说非常重要。出于这个原因，我们中的许多人都同意他们的存在。 tjvantoll.com/2013/01/28/…

标签： html css hyperlink outline

【解决方案1】：

尝试所有这些，直到你找到适合你的情况。

a:active, a:focus, li:focus, li:active {
    outline: none !important;
    border: none !important;        
    text-decoration: none !important;
    box-shadow: none !important;
    -webkit-tap-highlight-color: transparent !important;
    -webkit-user-select: none; /* Chrome/Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+ */
    user-select: none;
}

【讨论】：

【解决方案2】：

为我工作

我为此奋斗了一段时间，这在带有 StoreFront 主题的 WordPress 5.5.3 上对我有用：

a:hover,
a:active {
    outline: none;
    box-shadow: none !important;
}

【讨论】：

【解决方案3】：

如果上述解决方案中的至少一个对任何人都不起作用。也试试这个

a:active, a:focus {
 box-shadow: none;
}

【讨论】：

【解决方案4】：

只需在您的样式文件中添加a:visited { outline: none; }。

【讨论】：

【解决方案5】：

只需添加大纲：无；文字装饰：无；

【讨论】：

【解决方案6】：

你可以用这个：

a:active, a:focus {
  outline: 0;
  border: none;
  -moz-outline-style: none;
}

【讨论】：

我已经为您更新了解决方案。我已经在链接上添加了焦点状态，还添加了 moz-outline 属性。 :) 你能确认一下吗？
border 与此无关。
大纲：0；知道非常有用

【解决方案7】：

固定：

在我的 CSS 中发现已经生成了用于在 a:active 上创建大纲的代码。这是覆盖我的代码并删除它解决了问题。

【讨论】：