Html Bootstrap 导航栏 - 无法更改字体颜色
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/24899720/
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
Bootstrap navbar - can't change font color
提问by Michael_L
So for some reason I can't change font color of my Bootstrap navbar - it keeps appearing blue. I've tried changing the background color of the navbar but with the same result. It was OK (white) until I set the background color to 'transparent' for the navbar to look the way I wanted it to look, but I thought it won't be a problem to change it later on so I didn't pay attention to it. Thanks for your response.
因此，出于某种原因，我无法更改 Bootstrap 导航栏的字体颜色 - 它一直显示为蓝色。我尝试更改导航栏的背景颜色，但结果相同。没关系（白色），直到我将导航栏的背景颜色设置为“透明”以使其看起来像我想要的样子，但我认为以后更改它不会有问题，所以我没有付钱关注它。感谢您的答复。
CSS
CSS
.navbar {
position:absolute;
top:25px;
z-index:10;
width:100%;
background-color: transparent;
padding-right: 20px;
font-family: 'Droid Sans', sans-serif;
font-size: 17px;
color: white;
}
HTML
HTML
<div class="bannerContainer">
<nav class="navbar">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand">Brand</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown<b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
</ul>
</li>
<li><a href="#">Link</a></li>
</ul>
</div><!--/.nav-collapse -->
</nav>
回答by zessx
That's because this rule :
那是因为这个规则：
a {
color: #428bca;
text-decoration: none;
}
To override it, use this CSS :
要覆盖它，请使用此 CSS：
.navbar a {
color: white;
}
回答by neno
Try with !important
尝试使用 !important
color: white !important;
回答by BK004
You need to use this property
您需要使用此属性
.navbar-nav>li>a {
color : //desired color here
}
in case of inverse navbar
在反向导航栏的情况下
.navbar-inverse .navbar-nav > li > a {
color : //desired color here
}
回答by elmauro
Advice to use bootstrap is always good to be well specified in your CSS. for example the color of your font you can change it to directly
在 CSS 中明确指定使用引导程序的建议总是好的。例如，您可以直接将字体颜色更改为
a{
color: white
}
but there are cases that the specificity of Bootstrap is higher and does not let you change it even if you put "!important". In that case it is better to attack the "a" where it is relatively For example.
但有些情况下，Bootstrap 的特异性更高，即使你放了“!important”也不会让你改变它。在这种情况下，最好攻击“a”相对的位置。例如。
.navbar a{
color: white
}
