如果你想让Chrome显示平台默认的“黄色”轮廓，这里有一些改变。

textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus, .uneditable-    input:focus {
    border-color: none;
    box-shadow: none;
    -webkit-box-shadow: none;
    outline: -webkit-focus-ring-color auto 5px;
}

对于焦点前的输入边框。你可以指定你想要使用的最喜欢的颜色和其他css，如填充等

.input {
    padding: 6px 190px 6px 15px;
    outline: #2a65ea auto 105px ;
}

当我们关注输入时。你可以指定你喜欢的颜色轮廓

.input:focus{
    box-shadow: none;
    border-color: none;
    outline: lightgreen auto 5px ;
}

我不能解决这个与CSS。似乎bootstrap是得到最后的发言权，即使我有网站。css后bootstrap。无论如何，这对我很有用。

$(document).ready(function () {
    var elements = document.getElementsByClassName("form-control");

    Array.from(elements).forEach(function () {
        this.addEventListener("click", cbChange, false);
    })

    });

function cbChange(event) {
    var ele = event.target;
    var obj = document.getElementById(ele.id);
    obj.style.borderColor = "lightgrey";
}

后来我发现这在css工作。显然只有表单控件

.form-control.focus, .form-control:focus {
    border-color: gainsboro;
} 

这里是Chrome开发工具之前和之后的照片。注意对焦和不对焦边界颜色的区别。另一方面，这对按钮不起作用。与按钮。与按钮，你必须改变轮廓属性为none。

最后，我在bootstrap.css中修改了以下css条目

textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {   
  border-color: rgba(126, 239, 104, 0.8);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(126, 239, 104, 0.6);
  outline: 0 none;
}

如果你想让Chrome显示平台默认的“黄色”轮廓，这里有一些改变。

textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus, .uneditable-    input:focus {
    border-color: none;
    box-shadow: none;
    -webkit-box-shadow: none;
    outline: -webkit-focus-ring-color auto 5px;
}

试试这个，它和bootstrap的输入是一样的…

input:focus{
  color: #212529;
  background-color: #FFF;
  border-color: #86B7FE;
  outline: 0;
  box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25);
}