试试其中一个吧:

大纲:0; 或 大纲:0 px; 或 大纲:没有;

而且 (美元).trigger(“模糊”);

虽然这里提供的CSS解决方案有效，

对于任何喜欢使用Bootstrap 4方式的人，就像官方Bootstrap主题指南中建议的那样， 这应该会有帮助:

按你们的习惯。SCSS文件(参见上面的指南^)，其中您添加了您的变量覆盖，添加以下变量来删除按钮的盒子阴影:

// import bootstrap's variables & functions to override them
@import "node_modules/bootstrap/scss/functions";
@import "node_modules/bootstrap/scss/variables";
@import "node_modules/bootstrap/scss/mixins";

// override the variables you want (you can look them up in node_modules/bootstrap/scss/variables file, they're the ones that have the !default keyword at the end)
$btn-focus-box-shadow: none;

// option A: include all of Bootstrap (see the above guide for other options)
@import "node_modules/bootstrap/scss/bootstrap";

这对我很有用。

请注意，在bootstrap的变量文件中有许多变量用于box-shadow，也用于其他控件，所以如果你想使用它们和/或这个特定的变量不适合你，可能需要更多的研究。

直接在HTML标签中(在您可能想要在设计的其他地方留下引导主题的场景中)..

尝试的例子..

<button style="border: transparent;">

<button style="border: 1px solid black;">

. .等。这取决于你想要的效果。

对于任何使用react-bootstrap并遇到此问题的人，以下是我所做的工作:

.btn:focus {
    /* the !important is really the key here, it overrides everything else */
    outline: none !important;
    box-shadow: none !important;
}

在添加!之前，事情并没有工作。

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

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

请注意，这对可访问性有影响，除非你的按钮和输入有一个良好的一致的焦点状态，否则不建议这样做。根据下面的评论，有些用户不能使用鼠标。

我找到了解决办法。 当我们聚焦时，bootstrap使用box-shadow，所以我们只是禁用它(声誉不够，无法上传图像:)。

我添加

.btn:focus{
    box-shadow:none !important;
}

它的工作原理。