html - 如何更改引导导航栏的背景颜色
问题描述
我正在尝试更改在 Bootstrap 中编码的导航栏的颜色。到目前为止,已经有内置的 Bootstrap 类应用于导航栏以更改背景颜色和其中的锚链接,但它们根本没有改变颜色。有什么办法可以解决这个问题吗?
这是HTML:
<!-- import Bootstrap -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<nav class="navbar navbar-light bg-white navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!-- <a class="navbar-brand" href="#">WebSiteName</a> -->
<a href="index.html"><img src="fusebloomLogo.png" alt="FuseBloom logo" class="logo"/></a>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav">
<li class="active"><a href="#home">Home</a></li>
<li><a href="#mission">Mission</a></li>
<li><a href="#reviews">Reviews</a></li>
<li><a href="#process">Process</a></li>
</ul>
</div>
</div>
</nav>
解决方案
.navbar-light {
background-color: yellow !important;
}
推荐阅读
- google-sheets-api - google.Script.run 未返回有关 DOMContentLoaded 执行的数据
- pytorch - 带有pytorch的resnet50中缺少/意外的键
- excel - 检查单元格的百分比格式
- reactjs - React App S3 托管,Url 参数在 S3 上不起作用
- python-3.x - NameError:名称'DatabaseManage'未在python中定义
- php - 在laravel的foreach循环中迭代元素
- latex - tcolorbox 与 tabular、tabularx 兼容吗?
- laravel - 部署中的 Laravel 和 vue js
- linux - 如何使用 awk 从多个文件中搜索字符串?
- python - PYTHON Pandas:在两个数据框中用字符串求和