html - CSS:如何删除奇怪的线条

Question

我有一个按钮 .当我点击它时，会出现一些奇怪的虚线，如下所示 我无法删除。尝试了我在 CSS 中所知道的一切，但无法修复。请帮忙。

这是我的CSS:

input.filterIcon {
width: 32px !important;
height: 32px !important;
background: url(../images/filter-icn.png) no-repeat center right !important;
padding: 0px !important;
cursor: pointer;
float: right;
vertical-align: middle;
margin: 0 0 0 10px !important;
font-size: 12px;
letter-spacing: 0.5px;
position: fixed;
z-index: 99999;
top: 70px;
right: 15px;
outline: 0 !important;
}

这是我的html

<form id="search_form">     
<input type="button" class="filterIcon" id="iconfilter">
</form>

Answer 1

默认情况下，当 anchor 链接变为“事件”或“聚焦”时，它们周围会有一个虚线轮廓。

如果您希望它消失，并且希望它出现在每个 anchor 链接上，只需将其作为您的 CSS 重置的一部分:

a, button {
  outline: 0;
}
a:hover, a:active, a:focus {
  /* styling for any way a link is about to be used */
}

Firefox Inputs 点击 input type=image 可以产生一个虚线轮廓 要删除它:input::-moz-focus-inner { border: 0; }

来源:https://css-tricks.com/removing-the-dotted-outline/