css - 如何自定义 bootstrap 开关颜色

如何将自举程序开关的颜色自定义为所需的颜色？

我找到了oncolor和offcolor，但不知道如何更改它们。

最佳答案

根据this page，每个选项也是一种方法。因此，您可以像这样应用onColor和OffColor:

$("#sw").bootstrapSwitch({onColor: 'danger'});

或类似的:

$("#sw").bootstrapSwitch();
...
$("#sw").bootstrapSwitch('onColor', 'danger');

或覆盖库的默认选项:

$.fn.bootstrapSwitch.defaults.onColor = 'danger';

要使用自己的颜色，您需要创建自己的CSS类。例如，此类使用带有颜色的“复古橙色”名称:

.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-retroorange,
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-retroorange {
  color: #fff;
  background: #ff9933;
}

然后，您可以按照以下常规方式使用'retroorange':

$("#sw").bootstrapSwitch({onColor: 'retroorange'});