[英]Bootstrap navbar - can't change font color
所以由於某種原因,我不能改變我的Bootstrap導航欄的字體顏色 - 它一直呈現藍色。 我已經嘗試更改導航欄的背景顏色,但結果相同。 這是好的(白色),直到我將背景顏色設置為'透明',導航欄看起來像我想要的樣子,但我認為以后更改它不會有問題所以我沒有付款注意它。 感謝您的答復。
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
<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>
那是因為這條規則:
a {
color: #428bca;
text-decoration: none;
}
要覆蓋它,請使用此CSS:
.navbar a {
color: white;
}
試試!重要
color: white !important;
您需要使用此屬性
.navbar-nav>li>a {
color : //desired color here
}
在反向導航的情況下
.navbar-inverse .navbar-nav > li > a {
color : //desired color here
}
使用bootstrap的建議總是很好的在CSS中很好地指定。 例如,您可以直接將其更改為字體的顏色
a{
color: white
}
但是有些情況下Bootstrap的特性更高,即使你把“!important”改名也不會讓你改變它。 在這種情況下,最好是攻擊相對的“a”例如。
.navbar a{
color: white
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.