如何删除边框？

Question

请帮助解决问题。

HTML：

<img class="logo_pic img-responsive" src="images/logo.png" alt="logo" usemap="#link_index" />

<map name="link_index">
    <area shape="rect" coords="1,1,400,480" href="index.html" alt="" />
</map>  

问题是，当您单击图像时，图像中会出现蓝色边框。 他们在一秒钟内消失了，但我需要使其不出现

http://jsfiddle.net/Ub886/1/

谷歌浏览器最新版本

Answer 1

您看到的蓝色边框实际上是处于“活动”状态的超链接。 您可以添加css定义来设置这些边框的样式：

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

小提琴为例

Answer 2

尝试：

<img class="logo_pic img-responsive" src="images/logo.png" alt="logo" usemap="#link_index" style="border:0"/>

您也可以在CSS样式表上执行此操作

.logo_pic img-responsive {
    border:0;
}

.logo_pic img-responsive:hover {
    border:0;
}

编辑

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

的jsfiddle：

http://jsfiddle.net/Ub886/4/

Answer 3

内联CSS ...

<img class="logo_pic img-responsive" src="images/logo.png" alt="logo" style="border:0;" usemap="#link_index" />

<map name="link_index">
    <area shape="rect" coords="1,1,400,480" href="index.html" alt="" />
</map>