如何从复选框中删除蓝色边框（Bootstrap4.1）

Bootstrap 4.1

如何从焦点上显示的复选框中删除蓝色边框？

我尝试使用轮廓，但是它不起作用。

我使用的代码是：

    
    Check this custom checkbox

实时版本或示例是：https : //jsfiddle.net/hus​​sainabid/mgdjprst/

box-shadow以下规则有一个：.custom-control-input:focus ~ .custom-control-label::before。您可以通过添加以下CSS（在Bootstrap CSS之后）将其删除：

.custom-control-input:focus ~ .custom-control-label::before {
    box-shadow:none !important;
}

注意：代替!important您也可以更具体。

例：

.custom-control-input:focus ~ .custom-control-label::before {
    box-shadow:none !important;
}

.custom-control-input:focus ~ .custom-control-label::before {
  box-shadow:none !important;
}