如何删除超链接图像周围的轮廓？

Question

当我们使用CSS使用文本替换并给出否定的测试缩进即text-indent:-9999px.然后,当我们点击该链接时,虚线显示在下面的示例图像中.这是什么解决方案？

Answer 1

用于删除锚标记的轮廓

a {outline : none;}

从图像链接中删除轮廓

a img {outline : none;}

从图像链接中删除边框

img {border : 0;}

Answer 2

您可以在锚元素上使用CSS属性"outline"和值"none".

a {
outline: none;
}

希望有所帮助.

Answer 3

对于Internet Explorer 9:

a:active, a:focus { 
 outline: none; 
 ie-dummy: expression(this.hideFocus=true);
}

资料来源:http://social.msdn.microsoft.com/Forums/en-HK/ieextensiondevelopment/thread/1023adfd-bd73-47ac-ba9c-2bad19ac583a

Answer 4

请注意,焦点样式有一个原因:如果您决定删除它们,通过键盘导航的人只会不知道焦点是什么,所以您会损害您网站的可访问性.

(保持它们的位置也有助于不喜欢使用鼠标的高级用户)

Answer 5

在Firefox和Internet Explorer(IE)中有相同的边框效果,当您单击某个链接时它会变得可见.

这段代码只会修复IE:

a:active { outline: none; }.

这个将修复Firefox和IE:

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

如果您要从网站中删除链接边框,则应将最后一个代码添加到样式表中.

Answer 6

在样式表中包含此代码

img {border : 0;}

a img {outline : none;}