Internet Explorer 9 中图像映射周围的蓝色边框答案

【问题标题】：Blue border around image maps in Internet Explorer 9Internet Explorer 9 中图像映射周围的蓝色边框
【发布时间】：2013-12-31 00:13:12
【问题描述】：

我遇到了以下问题 - 我在网站上使用图像地图。在 Internet Explorer 9（IE8 很好）中，当我单击链接（区域标记）时，它周围会出现一个蓝色边框。如何摆脱它？我试过了：

map, map area {
border:none !important;
}
img, a img, a:link img, a:visited img {
border:none !important;
}

但这并没有帮助。有没有人有这个问题？请查看该网站 - http://www.naturalnie.test.dih.pl/。图片地图位于徽标下方，其中链接显示：“Home, Kosmetyki, Lekarstwa, Żywność i supplementy, O Naturalnie.net”。

编辑：

我找到了解决方案。以下代码有效：

a, img {outline:none;}
map > area,
map > area:active,
map > area:focus {outline: none; border:0; }

【问题讨论】：

how to remove blue border around links in IE9?的可能重复

标签： css internet-explorer border

【解决方案1】：

为什么不直接

a,img { border: none; }

【讨论】：

天哪，我忘了在那里添加“a”。但是，它仍然不起作用。

【解决方案2】：

这对我有用

:focus{
  border: none;
  outline-style: none; 
  -moz-outline-style:none;  
}

【讨论】：

【解决方案3】：

我不太确定，但尝试在 html 中设置 <img border="0" />

【讨论】：

嗯，我试过<area border="0"> - 但不幸的是，它没有用。

【解决方案4】：

既然你说点击链接后会出现边框，我觉得这听起来像是一个“焦点”边框。

试试a:focus {border:0 none;}

【讨论】：

【解决方案5】：

此解决方案将导致与兼作链接和内容的同时具有边框的图像发生冲突。但是，如果您的图片链接没有现有的边框，它应该可以在 IE 中消除您的轮廓，而不会影响其他任何内容：

a img {border: none; }

只需将它添加到您的主 css 样式表...它完美地解决了我的问题。

【讨论】：