HTML如何在单击时删除按钮周围的焦点

单击按钮后，它们的周围都有一个突出显示。这是在Chrome中。

<button class="btn btn-primary btn-block">
    <span class="icon-plus"></span> Add Page
</button>

我正在使用带有主题的 Bootstrap，但我很确定事实并非如此：我之前在另一个项目中注意到了这一点。

如果我使用标签而不是.为什么？如果我想使用，我将如何让它消失？<a><button><button>

分割线

网友回答：

我在另一页上找到了这个问答，覆盖按钮焦点样式对我有用。此问题可能特定于带有 Chrome 的 MacOS。

.btn:focus {
  outline: none;
  box-shadow: none;
}

但请注意，这会对辅助功能产生影响，在按钮和输入具有良好的一致焦点状态之前，不建议这样做。根据下面的评论，有些用户无法使用鼠标。

分割线

网友回答：

你想要这样的东西：

<button class="btn btn-primary btn-block" onclick="this.blur();">...

.blur（）方法正确地删除了焦点突出显示，并且不会弄乱 Bootstraps 的样式。

分割线

网友回答：

我的理解是，焦点是在活动结束后首先应用的，因此根据您的需求，打电话可能是一个干净的解决方案。这当然是一个可访问性友好的解决方案，但显然它会调整鼠标点击的行为，这可能与您的 Web 项目不兼容。onMouseDowne.preventDefault()onMouseDown

我目前正在使用此解决方案（在项目中），单击后没有收到焦点闪烁或按钮保留焦点，但我仍然能够标记我的焦点并直观地可视化相同按钮的焦点。react-bootstrap

模板简介：该模板名称为【HTML如何在单击时删除按钮周围的焦点】，大小是暂无信息，文档格式为.编程语言，推荐使用Sublime/Dreamweaver/HBuilder打开，作品中的图片，文字等数据均可修改，图片请在作品中选中图片替换即可，文字修改直接点击文字修改即可，您也可以新增或修改作品中的内容，该模板来自用户分享，如有侵权行为请联系网站客服处理。欢迎来懒人模板【HTML】栏目查找您需要的精美模板。