引导。无法更改导航栏链接颜色。即使有ID

时间:2016-10-24 06:17:22

标签: html css twitter-bootstrap

我正在尝试设置我的bootstrap导航栏,但我无法更改链接的颜色。我已经读过bootstrap.css可能会覆盖我的自定义css文件,因此我使用ID #menu_buttons优先考虑整个ul。但是字体颜色仍然不会改变,虽然我可以使用应用于此ID的字体大小来改变它的大小。 我也试过用.navbar-default .navbar-nav>更改它。 li>一个 { 但仍然无法正常工作。我究竟做错了什么?

HTML:

<!DOCTYPE html>
<head>
  <title>Restart</title>
   <link rel="stylesheet" href="css/bootstrap.min.css" type="text/css">
   <link rel="stylesheet" href="css/style.css" type="text/css">


 </head>
 <body>
<nav class="navbar navbar-inverse">
<div class="container-fluid">
 <div class="navbar-header">
  <a class="navbar-brand" href="#"><img src="logo.png" height="40"</a>
  </div>
   <ul id="menu_buttons" class="nav navbar-nav navbar-right">
    <li><a href="#"><span class="glyphicon glyphicon-user"></span> Регистрация</a></li>
    <li><a href="#"><span class="glyphicon glyphicon-log-in"></span> Войти</a>      </li>
     </ul>
     </div>
 </nav>
<script src="js/bootstrap.min.js"></script>  
   </body>
   </html>

CSS:

.navbar {
background-color:#f3f9fe;

}

.navbar-brand {
 margin-top:-8px; 
}


#menu_buttons {
color:red;
}

.navbar-default .navbar-nav > li > a {
color:red;
}

1 个答案:

答案 0 :(得分:2)

变化:

.navbar-default .navbar-nav > li > a {
color:red;
}

到此:

.navbar .navbar-nav > li > a {
color:red;
}