我在我的nodeJS项目中使用SweetAlert，它的工作就像一个魅力，除了当我显示一个确认模态时，它将焦点设置为确认按钮，并且它得到了这个可怕的轮廓。
这就是它是如何：
这就是我想要的：
我已经尝试覆盖它的样式并将outline设置为none，但它不起作用：
.sweet-alert button.confirm {
outline: none !important; }我也试着用这种风格摆脱任何轮廓：
*:focus, *:active {
outline: 0 !important; }这是我用来触发SweetAlert模式的代码：
swal({ title: "Confirmation",
text: "Are you sure you want to remove this credit card?",
showCancelButton: true,
confirmButtonText: "Yes, remove it",
closeOnConfirm: true },
doRemoveCard);这是sweetalert.min.js中设置焦点的代码段：
a=o.querySelector("button.confirm");a.focus()有什么办法可以摆脱这个大纲吗？
7条答案
按热度按时间20jt8wwn1#
你可以尝试这个sweetalert2 v7.x.x
.swal2-popup .swal2-styled:focus { box-shadow: none !important; }6rqinv9w2#
这个问题最初发布于2年前，但对于那些在最新版本（2.1.x）中寻找解决方案的人来说，请用途：
xtupzzrd3#
.class：focus { overflow：隐藏; }
将“class”替换为所需的class
rn0zuynd4#
使用一个特定的选择器pseudoclass：focus来去除SweetAlert的X Close按钮中的轮廓（box-shadow），并应用这些属性。仅使用：焦点是通用的，避免它，尝试这个特定的css规则。
lnvxswe25#
实际上。class是可选的，你需要改变你的按钮类，比如**.sweet-alert button.confirm**使用inspect element工具查找类，并将它们的焦点概述隐藏在你的自定义css中。
bqujaahr6#
使用SweetAlert2版本8.0.5，您可能希望在css文件中添加global：focus，以防止出现蓝色轮廓
这对我很有效。
67up9zun7#
这应该有助于：