如何使用CSS删除IE8中活动超链接周围的虚线边框

活动超链接文本以虚线边框突出显示。在这种超链接上使用效果时（fadeIn/fadeOut），会产生奇怪的效果。如何禁用/删除虚线边框？

尝试以下CSS：

a:active, a:selected, a:visited { 
    border: none;
    outline: none;
}

请注意，这必须在任何

a:hover

规则之后。感谢您在评论中建议使用

a:selected

选择器

注意

---

以上内容在IE 9中不起作用。删除：selected会导致它在IE9中工作。

小心。虚线边框是键盘浏览的重要部分。它突出显示将单击的链接

a:active { outline: none; }

---

作者Nathan Smith在他的博客上发表了文章和各种相关问题。

典型而安全的做法是：

a:active, a:focus {
   outline:  none; /* non-IE */
   ie-dummy: expression(this.hideFocus=true); /* IE6-7 */
}

由于IE8中已删除了

expression（）

，因此您可能需要一个脚本：

if (document.documentElement.attachEvent)
    document.documentElement.attachEvent('onmousedown',function(){
         event.srcElement.hideFocus=true
    });

---

如果要删除默认的焦点大纲，必须为

：focus定义自己的独特风格，否则键盘用户将很难使用您的网站。
a
{outline:none；}
会破坏键盘的可用性。而
a:active{}
选择器似乎破坏了它，就像上次我在Firefox中检查时一样

有一种JS方法可以在不破坏任何东西的情况下消除边界，还有一种JS代码可以在IE6和IE7中消除边界

我在中描述了该方法。
尝试使用此CSS：

a:active, a:selected, a:visited { 
    border: none;
    outline: none;
}

对于Mozilla：

|:-moz-any-link:focus { outline: none; }

|:focus { outline: none; }

button, input[type="reset"], input[type="button"], input[type="submit"] { outline: none; }

button::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="file"] > input[type="button"]::-moz-focus-inner { padding: 0px 2px 0px 2px; border: 1px dotted transparent; }

a:active, a:focus { 
    border:none;
    outline:none;
}


对于IE8：

|:-moz-any-link:focus { outline: none; }

|:focus { outline: none; }

button, input[type="reset"], input[type="button"], input[type="submit"] { outline: none; }

button::-moz-focus-inner, input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="file"] > input[type="button"]::-moz-focus-inner { padding: 0px 2px 0px 2px; border: 1px dotted transparent; }

a:active, a:focus { 
    border:none;
    outline:none;
}

就这样，不需要复杂化了。
您也可以在对象上使用outline:0并嵌入。一些基本的归零css如下所示：

a, a:visited { 
    text-decoration:none;
    color: #e3a512; 
    }
a:hover, a:active, a:focus { 
    text-decoration:none;
    color: #fff;
    outline:0;
    }
object, embed, a, a img, a:active, a:selected, a:visited {
    outline:0
    }

JavaScript解决方案删除所有浏览器链接上的活动边框：
在链接上添加事件onfocus=“this.blur（）；”

<a href="#" onfocus="this.blur()"> Link </a>



注意：这将适用于所有浏览器

a:focus, *:focus {
    noFocusLine: expression(this.onFocus=this.blur());
}

摘自这里：
这个对我最合适

a{
  outline: 0;
}

我想让这个对巴顿有用，这个对我有用

button { 

    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;    
    background-color: transparent;
    noFocusLine: expression(this.onFocus=this.blur());
}

可能想说键盘浏览而不是选项卡式浏览。是的，这是残疾人无障碍的必备功能。对我来说，这在IE8中有效，但FF3.5忽略了它。当链接处于活动状态时，它仍然显示虚线边框。有什么想法吗？忽略，我发现FF忽略了这个css：（我真的不确定；也许这个问题的其他答案会对你更有帮助。我也必须将这些设置为a:visited。a:selected在IE9中似乎不起作用。从上面的代码段中删除该选择器对我来说是个好办法。欢迎这样做！请尝试在你的答案中更明确一点。这完全正确，但有点困难。）一点信息。你也可以使用代码的格式功能。再一次，欢迎使用SO！css在cordova应用程序中对我不起作用，它起作用了。这是我在IE9中发现的唯一对按钮起作用的方法。我已经打算放弃了。非常感谢！@Barney，果然，他没有这样做，现在他的代码不见了，哈哈