如何使用 CSS 在 IE8 中删除活动超链接周围的虚线边框
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/1142819/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to remove dotted border around active hyperlinks in IE8 with CSS
提问by glaz666
Active hyperlink texts are highlighted with dotted border. When using effects on such hyperlinks (fadeIn/fadeOut) it produces strange effects. How do I disable/remove the dotted border?
活动超链接文本以虚线边框突出显示。在对此类超链接（淡入/淡出）使用效果时，会产生奇怪的效果。如何禁用/删除虚线边框？
回答by Lucas Jones
Try this CSS:
试试这个 CSS：
a:active, a:selected, a:visited {
border: none;
outline: none;
}
Note that this has to be after any a:hoverrules. Thanks to PErain the comments for suggesting using the a:selectedselector as well.
请注意，这必须a:hover遵循任何规则。感谢评论中的PEra 也建议使用a:selected选择器。
NOTE
笔记
The above does notwork in IE 9. Removing a:selected causes it to work in IE9.
上面并没有在IE9它选择原因工作：在IE 9.工作卸下。
回答by Kornel
Typical and safe way to do it is this:
典型且安全的方法是这样的：
a:active, a:focus {
outline: none; /* non-IE */
ie-dummy: expression(this.hideFocus=true); /* IE6-7 */
}
Since expresssion()has been gutted in IE8, you may need a script:
由于expresssion()已在 IE8 中被删除，您可能需要一个脚本：
if (document.documentElement.attachEvent)
document.documentElement.attachEvent('onmousedown',function(){
event.srcElement.hideFocus=true
});
If you're going to remove the default focus outline, you must define your own distinct style for :focus, otherwise keyboard users will have a hard time using your site.
如果您要删除默认焦点轮廓，则必须为 定义自己独特的样式:focus，否则键盘用户将很难使用您的站点。
回答by Sampson
Be careful. The dotted-border is a valuable part of keyboard-browsing. It highlights which link will be clicked.
当心。虚线边框是键盘浏览的重要组成部分。它突出显示将单击哪个链接。
a:active { outline: none; }
Author Nathan Smith gives a more thorough discussion of this, and various related issues on his blog.
作者 Nathan Smith在他的博客上对此进行了更深入的讨论，以及各种相关问题。
回答by Frankie Jarrett
a:active, a:focus {
outline:none;
}
回答by Ana
Try with this CSS:
试试这个 CSS：
For Mozilla:
对于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; }
For IE8:
对于IE8：
a:active, a:focus {
border:none;
outline:none;
}
回答by Ana
The a { outline: none; }breaks keyboard usability. And the a:active {}selector seems to break it just as good last time I checked in Firefox.
a{ outline: none; }打破了键盘的可用性。而a:active {}选择似乎打破它一样好，我最后一次在Firefox检查。
There is a JS way to get rid of the border without breaking anything, as well as JS code to get rid of the border in IE6 and IE7.
有一种JS方法可以在不破坏任何东西的情况下摆脱边框，以及在IE6和IE7中摆脱边框的JS代码。
I described the method in my tutorial.
我在教程中描述了该方法。
回答by Paulo Roberto
Solution in JavaScript to remove the active border on the links on all the browsers: add the event onfocus="this.blur();"on your link
在 JavaScript 中删除所有浏览器上链接上的活动边框的解决方案：添加事件onfocus="this.blur();" 在你的链接上
<a href="#" onfocus="this.blur()"> Link </a>
NOTE: this will work in all browsers.
注意：这将适用于所有浏览器。
回答by eva
a:focus, *:focus {
noFocusLine: expression(this.onFocus=this.blur());
}
Taken from here: http://www.cssjunction.com/css/remove-dotted-border-in-ie7/
取自这里：http: //www.cssjunction.com/css/remove-dotted-border-in-ie7/
回答by Tosh
This one works the best for me
这个最适合我
a{
outline: 0;
}
回答by Anoop Narayanan
i wanted to get this working for Button and this worked for me
我想让它为 Button 工作，这对我有用
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());
}
