如何在bootstrap按钮组上更改css

Question

以下代码切换组中的按钮.我很乐意改变这些按钮的CSS,尤其是所选按钮.

<span class="label label-primary">Age</span>
    <div class="btn-group" id="ageID">
    <button type="button" style="width:120px" class="btnMyAge btn-default" id="3">Under 10</button>
    <button type="button" style="width:120px" class="btnMyAge btn-default" id="1">Under 50</button>
    <button type="button" style="width:120px" class="btnMyAge btn-default" id="2">Over 50</button>
</div>
<script>
    $(".btn-group > .btnMyAge").click(function () {                                 
        $(this).addClass("active").siblings().removeClass("active");
    })
</script>

我的自定义CSS文件:

.btnMyAge, .btn:active
{
    background-color: #ffe13a;
}

Answer 1

将你的 CSS 更改为

.active {
    background-color: #ffe13a;
}

否则由于类background-color的原因，它会应用于所有按钮btnMyAge。