twitter-bootstrap 更改活动选项卡的背景颜色
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18018211/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Change background color of active tabs
提问by DavidX
Using Bootstrap v2.3.2, I am trying to change the default background color for the active tabs. I've tried to set as below, but it doesn't work:
使用 Bootstrap v2.3.2，我尝试更改活动选项卡的默认背景颜色。我试过如下设置，但它不起作用：
.nav-tabs > .active > a,
.nav-tabs > .active > a:hover,
.nav-tabs > .active > a:focus
{
color: #555555;
background-color: red;
}
Any advice as to why this isn't working, or how to fix it?
关于为什么这不起作用或如何解决它的任何建议？
回答by Gloria
In the Bootstrap v2.3.2 CSS file, the CSS is as follows for your snippet:
在 Bootstrap v2.3.2 CSS 文件中，您的代码段的 CSS 如下所示：
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
color: #555555;
cursor: default;
background-color: #ffffff;
border: 1px solid #dddddd;
border-bottom-color: transparent;
}
Compare this to your CSS snippet as you can see, you are missing the liselector before .activeselector.
Your CSS is correct however it does not work as the specificity in the Bootstrap CSS is more.
So Just change your code snippet to by increasing specificity:
如您所见，将此与您的 CSS 片段进行比较，您在li选择器之前缺少选择.active器。您的 CSS 是正确的，但是它不起作用，因为 Bootstrap CSS 中的特殊性更多。所以只需通过增加特异性来改变你的代码片段：
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus{
color: #555555;
background-color: red;
}
Now your browser when it renders the page will choose your CSS snippet. You can see an example here: http://jsfiddle.net/yyPrg/
现在，您的浏览器在呈现页面时将选择您的 CSS 片段。你可以在这里看到一个例子：http: //jsfiddle.net/yyPrg/
You can read up on CSS specificity here: http://css-tricks.com/specifics-on-css-specificity/and here: http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/
您可以在此处阅读 CSS 特异性：http: //css-tricks.com/specifics-on-css-specificity/和此处：http: //coding.smashingmagazine.com/2007/07/27/css-specificity-你应该知道的事情/
