如何在点击时删除“虚线边框”？

Question

如你所见

我想以某种方式删除点击按钮后的虚线。任何想法如何？

由于

GUYS：这是我的CSS ansd HTML的当前状态，但仍然没有USE：

.myButton input {
position:absolute;
display:block;
top: 5%;
left:87%;
height: 44px;
border:none;
cursor:pointer;
width: 43px;
font: bold 13px sans-serif;;
color:#333;
background: url("hover.png") 0 0 no-repeat;
text-decoration: none;
}
.myButton input:hover {  
background-position: 0 -44px;
color: #049;
outline: 0;
}
.myButton input:active {
background-position: 0 -88px;
color:#fff;
outline: 0;
}

input:active, input:focus {
      outline: 0;
}

<div class="myButton">
<input type="submit" value="">
</div>

似乎没有发生任何事情!!

Answer 1

你必须设置<a>样式：

a {outline: none}

Answer 2

使用以下代码

a:active
    {
    outline: none;
    }

尝试其他浏览器

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

Answer 3

也可以使用纯HTML：

<a href="..." hidefocus="hidefocus">...</a>

使用JavaScript，您可以在所有链接上执行此操作：

window.onload = function WindowLoad(evt) {
   //hide focus:
   var arrLinks = document.getElementsByTagName("a");
   for (var i = 0; i < arrLinks.length; i++) {
       arrLinks[i].hideFocus = "true";
}

Answer 4

尽管我对你的问题发表评论，

  

你应该保留它们   可访问性。

您可以找到your CSS-trick here for this

（无论如何，你应该保留它们。）

Answer 5

    #myElement { outline: 0; }

在你的元素上尝试这个，我现在不用，如果是图像，div，按钮，链接。但它有效

Answer 6

如果你想让大纲保持活跃和焦点，但是在点击链接时隐藏它，你可以添加css：

A.No-Outline {outline-style：none;}

并使用脚本：

$('A').hover(function() {
    $(this).addClass('No-Outline');
},function() {
    $(this).removeClass('No-Outline');
});

你必须在点击时悬停，这样就完成了工作。