jquery - Bootstrap 表单边框渐变

Question

默认情况下，单击 Bootsrap 表单会在边框上显示颜色渐变。

有没有办法修改 bootsrap.css 或 bootsrap.js 以显示渐变的其他颜色？

这是一个带有上图示例的 fiddle :https://jsfiddle.net/bb61c412/122/

还有代码:

#form-default {
  margin-top: 50px;
  width: 300px;
}
#form-green {
  border: 1px solid #000000;
  margin-top: 50px;
  width: 300px;
}

<link rel="stylesheet" type="text/css" href="https://bootswatch.com/bower_components/bootstrap/dist/css/bootstrap.min.css" />


<div class="form-group">

  <select id=form-default name="Form1" class="form-control">
    <option value="0">Form1</option>
    <option value="1">Option2</option>
    <option value="2">Option3</option>
  </select>

  <select id=form-green name="Form2" class="form-control">
    <option value="0">Form2</option>
    <option value="1">Option2</option>
    <option value="2">Option3</option>
  </select>

</div>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

Answer 1

如本答案所示..

Change Bootstrap input focus blue glow

覆盖 .form-control:focus 蓝色发光..

.form-control:focus {
      border-color: #FF0000;
      box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(255, 0, 0, 0.6);
}

更新 fiddle :https://jsfiddle.net/bb61c412/123/