引导程序.无法更改导航栏链接颜色.即使有ID [英] Bootstrap. Can't change navbar link color. Even with ID
本文介绍了引导程序.无法更改导航栏链接颜色.即使有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屋!
查看全文