单击“汉堡包”按钮时,drowpdown菜单将出现在徽标的侧面。我希望单击按钮时,下拉导航栏显示在徽标下方。
<body><!--bootstrap 3, customising bootstrap,--> <!--degracing down graceful degradation (RWD) instead of progressive enhancement -->
<div class="navbar navbar-inverse navbar-static-top">
<div class="container">
<a class="navbar-brand" href="#" >TechTech</a>
<button class="navbar-toggle" data-toggle="collapse" data-target=".navHeader">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div class="collapse navbar-collapse navHeader">
<ul class="nav navbar-nav navbar-right">
<li class="active"><a href="#">Home</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">Home</a></li>
</ul>
</div>
</div><!--container-->
</div><!--navbar-inverse-->
我在页面上添加了自定义CSS,并在与媒体查询合拢时定位了导航。
@media screen and (max-width: 992px) {
body {
background-color: blue;
}