更改 Bootstrap 4 复选框按钮的开/关颜色 [关闭]答案

【问题标题】：Changing the on/off colors of a Bootstrap 4 Checkbox Button [closed]更改 Bootstrap 4 复选框按钮的开/关颜色 [关闭]
【发布时间】：2018-10-08 04:30:34
【问题描述】：

我无法找到这些 css 属性的覆盖。请注意，在此示例页面https://getbootstrap.com/docs/4.1/components/buttons/#checkbox-and-radio-buttons 中，打开和关闭状态之间的颜色差异对我来说太微妙了。我想为任一州选择特定的颜色。

【问题讨论】：

标签： css twitter-bootstrap sass bootstrap-4

【解决方案1】：

你会找到默认引导覆盖的解决方案，但我更喜欢你使用自己的类

    .btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, .show>.btn-secondary.dropdown-toggle{
    color: #fff;
    background-color: green;
    border-color: green;
}

.btn:not(:disabled):not(.disabled) {
    cursor: pointer;
    background: red;
    border-color: red;
}

类似

.btn .btn-secondary .focus .toggle-on-off {

        background: red;
        border-color: red;
}

.btn .btn-secondary .focus .active toggle-on-off{
        background-color: green;
        border-color: green;
}

因为他们添加了类active

【讨论】：

通过一些小的改动（.btn-secondary:not 而不是 .btn:not 在第二个项目上）我让它工作了。还扔了几个！重要的。谢谢。