引导程序.无法更改导航栏链接颜色.即使有ID [英] Bootstrap. Can't change navbar link color. Even with ID

查看:49
本文介绍了引导程序.无法更改导航栏链接颜色.即使有ID的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

I am trying to style my bootstrap navbar, but I can't change the color of the links. I've read that the bootstrap.css might be overriding my custom css file, so I prioritized the whole ul with an ID #menu_buttons. But the font color still won't change, although I can change it's size using font-size applied to this ID. I've also tried changing it with .navbar-default .navbar-nav > li > a { but still doesn't work. What am I doing wrong?

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;
}

推荐答案

更改:

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

对此:

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

这篇关于引导程序.无法更改导航栏链接颜色.即使有ID的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆