Html 如何自定义Bootstrap 3选项卡颜色

我想使用Bootstrap3创建一个自定义选项卡

我所做的是-

<ul class="nav nav-tabs" id="myTab">
    <script type="text/javascript">
        $(document).ready(function()   {
           //1st (1-1 = 0) tab selected initialy
           $("#myTab li:eq(0) a").tab('show');
        });
    </script>

    <li><a data-toggle="tab" href="#sectionA">SEARCH</a></li>
    <li><a data-toggle="tab" href="#sectionB">ADVANCED</a></li>
</ul>
<div class="tab-content">
    <div id="sectionA" class="tab-pane fade in active">
        Aliquip placeat salvia cillum iphone. Seitan aliquip quis cardigan american apparel,
        butcher voluptate nisi qui.
    </div>
    <div id="sectionB" class="tab-pane fade">
        Vestibulum nec erat eu nulla rhoncus fringilla ut non neque. Vivamus nibh urna.
    </div>
</div>

$（文档）.ready（函数（）{
//初始选择第一个（1-1=0）选项卡
$（“#myTab li:eq（0）a”）.tab（'show'）；
});



salvia cillum iphone上的Aliquip placeat。Seitan aliquip quis羊毛衫美国服装，
屠夫纵容了尼西奎。
前庭必须是无菱形的。尼布乌纳万岁。

我要付这样的账单-

但我想有一个定制的彩色。 我是Bootstrap3的新手，所以我不知道怎么做

我想要的是这样的东西-

有人能帮我吗

---

提前感谢您的帮助。

我认为您应该编辑bootstrap.css上的锚定标记。否则，使用

为锚定标记提供自定义样式！重要信息

（覆盖bootstrap.css上的默认样式）

示例代码

.nav{
背景色：#000！重要；
}
.nav>li>a{
背景色：#666！重要；
颜色：#fff；
}

...
表1
表2
表3

在选择器

上。导航选项卡>li>a：悬停

添加

！重要信息

至

背景色

.nav选项卡{
背景色：#161616；
}
.选项卡内容{
背景色：#303136；
颜色：#fff；
填充：5px
}
.导航选项卡>li>a{
边界：中等无；
}
.nav选项卡>li>a:悬停{
背景色：#303136！重要；
边界：中等无；
边界半径：0；
颜色：#fff；
}

salvia cillum iphone上的Aliquip placeat。Seitan aliquip quis羊毛衫美国服装，
屠夫纵容了尼西奎。
前庭必须是无菱形的。尼布乌纳万岁。

.panel.with-nav-tabs.面板标题{
填充物：5px 5px 0 5px；
}
.面板.带导航标签.导航标签{
边框底部：无；
}
.面板。带导航标签。导航对齐{
边缘底部：-1px；
}
/********************************************************************/
/***面板默认值***/
.with-nav-tabs.panel-default.nav-tabs>li>a，
.with-nav-tabs.panel-default.nav-tabs>li>a：悬停，
.with-nav-tabs.panel-default.nav-tabs>li>a：焦点{
颜色：#777；
}
.with-nav-tabs.panel-default.nav-tabs>.open>a，
.with-nav-tabs.panel-default.nav-tabs>.open>a:悬停，
.with-nav-tabs.panel-default.nav-tabs>。打开>a:焦点，
.with-nav-tabs.panel-default.nav-tabs>li>a：悬停，
.with-nav-tabs.panel-default.nav-tabs>li>a：焦点{
颜色：#777；
背景色：#ddd；
边框颜色：透明；
}
.with-nav-tabs.panel-default.nav-tabs>li.active>a，
.with-nav-tabs.panel-default.nav-tabs>li.active>a:悬停，
.with-nav-tabs.panel-default.nav-tabs>li.active>a:focus{
颜色：#555；
背景色：#fff；
边框颜色：#ddd；
边框底色：透明；
}
.with-nav-tabs.panel-default.nav-tabs>li.dropdown.dropdown菜单{
背景色：#F5；
边框颜色：#ddd；
}
.with-nav-tabs.panel-default.nav-tabs>li.dropdown.dropdown menu>li>a{
颜色：#777；
}
.with-nav-tabs.panel-default.nav-tabs>li.dropdown.dropdown menu>li>a:悬停，
.with-nav-tabs.panel-default.nav-tabs>li.dropdown.dropdown menu>li>a:focus{
背景色：#ddd；
}
.with-nav-tabs.panel-default.nav-tabs>li.dropdown.dropdown menu>.active>a，
.with-nav-tabs.panel-default.nav-tabs>li.dropdown.dropdown menu>.active>a:悬停，
.with-nav-tabs.panel-default.nav-tabs>li.dropdown.dropdown菜单>.active>a:focus{
颜色：#fff；
背景色：#555；
}
/********************************************************************/
/***面板初级***/
.带-nav-tabs.panel-primary.nav tabs>li>a，
.with-nav-tabs.panel-primary.nav-tabs>li>a：悬停，
.with-nav-tabs.panel-primary.nav-tabs>li>a：焦点{
颜色：#fff；
}
.with-nav-tabs.panel-primary.nav-tabs>。打开>a，
.with-nav-tabs.panel-primary.nav-tabs>。打开>a:悬停，
.with-nav-tabs.panel-primary.nav-tabs>。打开>a:焦点，
.with-nav-tabs.panel-primary.nav-tabs>li>a：悬停，
.with-nav-tabs.panel-primary.nav-tabs>li>a：焦点{
颜色：#fff；
背景色：#3071a9；
边框颜色：透明；
}
.带-nav-tabs.panel-primary.nav tabs>li.active>a，
.with-nav-tabs.panel-primary.nav-tabs>li.active>a:悬停，
.with-nav-tabs.panel-primary.nav-tabs>li.active>a：焦点{
颜色：#428bca；
背景色：#fff；
边框颜色：#428bca；
边框底色：透明；
}
.with-nav-tabs.panel-primary.nav-tabs>li.dropdown.dropdown菜单{
背景色：#428bca；
边框颜色：#3071a9；
}
.with-nav-tabs.panel-primary.nav-tabs>li.dropdown.dropdown menu>li>a{
颜色：#fff；
}
.with-nav-tabs.panel-primary.nav-tabs>li.dropdown.dropdown menu>li>a:悬停，
.with-nav-tabs.panel-primary.nav-tabs>li.dropdown.dropdown menu>li>a:focus{
背景色：#3071a9；
}
.with-nav-tabs.panel-primary.nav-tabs>li.dropdown.dropdown menu>.active>a，
.with-nav-tabs.panel-primary.nav-tabs>li.dropdown.dropdown menu>.active>a:悬停，
.with-nav-tabs.panel-primary.nav-tabs>li.dropdown.dropdown menu>.active>a:focus{
背景色：#4a9fe9；
}
/********************************************************************/
/***小组成功***/
.with-nav-tabs.panel-success.nav-tabs>li>a，
.with-nav-tabs.panel-success.nav-tabs>li>a：悬停，
.with-nav-tabs.panel-success.nav-tabs>li>a：焦点{
颜色：#3c763d；
}
.with-nav-tabs.panel-success.nav-tabs>.open>a，
.with-nav-tabs.panel-success.nav-tabs>.open>a:悬停，
.with-nav-tabs.panel-success.nav-tabs>.open>a:focus，
.with-nav-tabs.pane