单击图片后如何删除显示的边框

Question

所以我有这个图像，每当我点击它时，它周围都有边框。 这就是我的意思

继承CSS吧

#form {
    position:fixed;
    right: -50px;
    border:none;
    top: 350px;
    z-index: -1;
    cursor: help;
}

这是HTML

div id="form" class="sidepan pic">
     <a href="url" target="_blank"><img src="imagelink"></a>
     </div>

有谁知道如何删除这个紫色边框？它只在点击时出现。

感谢。

Answer 1

在outline: none上设置a:focus。

#form {
  position: fixed;
  border: none;
  z-index: -1;
  cursor: help;
}
a:focus {
  outline: none
}

<div id="form" class="sidepan pic">
  <a href="url" target="_blank">
    <img src="imagelink" alt="image">
  </a>
</div>

Answer 2

删除outline标记上的a：

#form a{
   outline: none;
}

FIDDLE

Answer 3

在CSS中试试这个：

a img {
  border: none;  
}