我正在使用Bootstrap 3,我想更改 .navbar-inverse 链接的背景颜色和悬停状态。我尝试了所有的东西和课程,没有任何运气。它仍然显示出相同的黑色渐变。
<!-- Navigation -->
<nav class="navbar navbar-inverse navbar-static-top" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<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" href="#">
<img src="images/logo.png" alt="">
</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse navbar-right" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li class="hotel"><a href="index.html">Hotel</a></li>
<li><a href="rooms_suites.html">Rooms & Suites</a></li>
<li><a href="reservation.html">Reservation</a></li>
<li><a href="activities.html">Activities</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div><!-- /.container -->
</nav>
<!-- End Of Navigation -->
答案 0 :(得分:0)
您的浏览器开发人员工具可以轻松帮助您找到要使用的正确选择器。 Right Click > Inspect Element
.navbar-inverse .navbar-nav>li>a:focus,
.navbar-inverse .navbar-nav>li>a:hover {
color: red;
background: green;
}