Question

我有一个链接的图像。当我点击它时，它会将我发送到某个地方然后如果我单击返回该页面上返回该图像周围有1px点缀蓝色边框。此外，如果我点击它并保持边框变为红色。这看起来很糟糕，我找不到删除该边框的方法。我试过

a:visited {text-decoration: none}
a:active {text-decoration: none}

和：

a:visited img{text-decoration: none}
a:active img{text-decoration: none}

没有效果。顺便说一句，这个边框不会出现在chrome中。

这是我对该图像的css代码：

#back_to_photos{
float:right;
position: relative;
margin-top:-238px;
margin-right: 40px;

}
a:visited {text-decoration: none}
a:active {text-decoration: none}

谢谢！

Answer 1

您的规则顺序可能有问题（不知道这些是您示例中提到的唯一样式）。您可以尝试使用！important ：

来“强迫它”

a {text-decoration: none !important;}

希望有所帮助。

Answer 2

您的问题的解决方案是：

a:link, a:link:hover { text-decoration: none }

希望它有所帮助。

有关详情：squarefree.com/styles

Answer 3

This post描述了如何操作。也就是说，将outline: 0;放入a:visited CSS应该可以解决问题。

text-decoration仅处理下划线和删除线等内容。您遇到的问题是使用outline围绕点击/聚焦链接，告诉用户他们正在悬停的位置。

请注意，如果您删除了轮廓，那么如果用户使用键盘导航您的页面，则用户所在的位置将不明显。

Answer 4

您想使用outline: none。

但请注意，隐藏轮廓会导致可用性问题，尤其是那些使用键盘导航的用户。

a：访问{text decoration：none}无法在Firefox中运行

4 个答案: