Html 将 img 标签放在 a href 标签内会导致 IE 中的图像周围出现边框
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6066652/
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
putting an img tag inside of an a href tag causes a border around image in IE
提问by user541597
I have some HTML where I have img tags inside of an href tag to use as a button. Everything works fine except that when I open it in IE, I get a border around the img tag.
我有一些 HTML，其中在 href 标签内有 img 标签可用作按钮。一切正常，除了当我在 IE 中打开它时，我在 img 标签周围有一个边框。
Here's some code:
这是一些代码：
<a href="javascript:changecolor(1)" title="Click Again to Change Color" style="cursor:pointer; text-decoration:none"><img src="button.png" width="25" height="25" style="margin-top:600px;" /></a>
<a href="javascript:changecolor(2)" title="Click Again to Change Color" style="cursor:pointer"><img src="button.png" width="25" height="25" style="margin-top:600px;" /></a>
<a href="javascript:changecolor(3)" title="Click Again to Change Color" style="cursor:pointer"><img src="button.png" width="25" height="25" style="margin-top:600px;" /></a>
<a href="javascript:changecolor(4)" title="Click Again to Change Color" style="cursor:pointer"><img src="button.png" width="25" height="25" style="margin-top:600px;" /></a>
<a href="javascript:changecolor(7)" title="Click Again to Change Color" style="cursor:pointer"><img src="button.png" width="25" height="25" style="margin-top:600px;" /></a>
<a href="javascript:changecolor(6)" title="Click Again to Change Color" style="cursor:pointer"><img src="button.png" width="25" height="25" style="margin-top:600px; text-decoration:none" /></a>
How can I get rid of the blue border, which only appears in IE?
我怎样才能摆脱只出现在 IE 中的蓝色边框？
回答by Dan
Simple fix, in your stylesheet create a style similar to this:
简单的修复，在你的样式表中创建一个类似于这样的样式：
a img{
border:0;
}
In your case, you could update your style to include some of the inline styles you have in your HTML. For example, your stylesheet would be updated to:
在您的情况下，您可以更新样式以包含 HTML 中的一些内联样式。例如，您的样式表将更新为：
a{
cursor:pointer;
text-decoration:none
}
a img{
margin-top:600px;
}
回答by Amareswar
Add border="0" attribute to the img tag
给img标签添加border="0"属性
回答by GSoft Consulting
Regarding the minor issue with Internet Explorer and the grayed box around the anchor tag - this is outline. To hide the outline box you can use following CSS:
关于 Internet Explorer 的小问题和锚标记周围的灰色框 - 这是大纲。要隐藏大纲框，您可以使用以下 CSS：
a img{outline:none;}
