当我点击我的 HTML 按钮时，会显示一个蓝色的“选择”边框[重复]答案

【问题标题】：When I click on my HTML button, a blue "selection" border is displayed [duplicate]当我点击我的 HTML 按钮时，会显示一个蓝色的“选择”边框[重复]
【发布时间】：2016-11-25 08:09:03
【问题描述】：

我创建了这个 HTML 按钮，并在使用 CSS 对其进行样式设置后，每次单击它时，它周围都会出现一个蓝色的选择边框。有没有什么办法解决这一问题？我知道默认未更改的元素在我创建它时不会这样做，所以我认为它一定与我添加的 CSS 有关。

HTML：

<button type="button" class="drop-button" >-</button>

CSS：

.drop-button {
    background-color: #343436;
    color: #FFFFFF;
    border: none;
    border-radius: 5px;
    margin-right: 8px;
    margin-left: 4px;
    height: 20px;
    width: 25px;
    font-size: 20px;
    vertical-align: middle;
    line-height: 0px;
}

Here is a link to it.http://jsfiddle.net/xytxnpyt/

【问题讨论】：

标签： html css button

【解决方案1】：

这是 Chrome 的默认行为。你可以用这个关闭它...

button:focus{
outline: none;
}

【讨论】：

这解决了我的问题，感谢您这么快回答！
乐于助人。您会看到它在其他一些浏览器中没有这样做。这主要是 Chrome 的事情。

【解决方案2】：

给你：

.drop-button:focus {
    outline: 0;
}

Fiddle

【讨论】：

【解决方案3】：

虽然我无法重现您在 JSFiddle 中所说的蓝色选择边框，但请尝试添加“outline-width:0px;”到按钮的CSS，看看有没有什么作用

【讨论】：