【问题标题】:How to customize bootstrap switch color如何自定义引导开关颜色
【发布时间】:2015-04-11 07:46:11
【问题描述】:

如何将引导开关颜色自定义为所需颜色?

我找到了oncoloroffcolor,但不知道如何更改它们。

【问题讨论】:

    标签: css customization bootstrap-switch


    【解决方案1】:

    根据this page,每个选项也是一种方法。所以你可以像这样应用 onColor 和 OffColor:

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

    或类似:

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

    或覆盖库的默认选项:

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

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

    .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'});
    

    【讨论】:

    • 谢谢@alemv 但我想使用我自己的颜色,比如这个:#ff9933!
    • 我在回答中添加了一种如何使用自己的颜色的方法。
    • 所以我应该使用css定义的类?
    • bootstrap-switch.org 的链接不再有效。它要么转到域占位符,要么有时转到邪恶的“您的 Flash 插件已过期”页面。
    猜你喜欢
    • 2013-12-21
    • 2021-01-05
    • 2021-06-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-09-17
    • 2011-12-05
    • 2018-07-23
    相关资源
    最近更新 更多