我在我的網站上有下拉菜單。這裏是代碼更改摺疊菜單的背景顏色
<nav class="navbar navbar-custom navbar-fixed-top top-nav-collapse" role="navigation">
<div class="container" style="height:80px;">
<div class="navbar-header" style="">
<button type="button" class="navbar-toggle glyphicon glyphicon-menu-hamburger" data-toggle="collapse" data-target=".navbar-main-collapse">
<i class="fa fa-bars"></i>
</button>
<a class="navbar-brand page-scroll" href="#page-top">
<i class="fa fa-play-circle"><img style="width:100px;height:50px;" src="/img/logo10.png"></i>
</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse navbar-right navbar-main-collapse" >
<ul class="nav navbar-nav">
<!-- Hidden li included to remove active class from about link when scrolled up past about section -->
<li class="hidden">
<a href="#page-top"></a>
</li>
<li style="padding-top:10px;font-size:20px;" class="">
<a class="page-scroll" href="#about">О нас</a>
</li>
<li style="padding-top:10px;font-size:20px;" class="">
<a class="page-scroll" href="@Url.Action("Courses","Home")">Курсы</a>
</li>
<li style="padding-top:10px;font-size:20px;" class="">
<a class="page-scroll" href="@Url.Action("Development","Home")">Разработка</a>
</li>
<li style="padding-top:10px;font-size:20px;" class="active">
<a class="page-scroll" href="#contact">Контакты</a>
</li>
<li style="padding-top:10px;font-size:20px;" class="active">
<a class="page-scroll" href="@Url.Action("Index","Blog")">VR Блог</a>
</li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container -->
</nav>
現在它是透明的。我嘗試將背景更改爲紅色。
這裏是引導CSS
.navbar-nav > li > .dropdown-menu {
margin-top: 0;
border-top-left-radius: 0;
border-top-right-radius: 0;
background-color: red;
}
.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu {
margin-bottom: 0;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
background-color: red;
}
的代碼,但它仍然保持透明。我不明白哪裏是問題?
如何更改下拉菜單的背景顏色?
你的CSS選擇器不匹配任何在語法元素包括在內。 – UncaughtTypeError