【发布时间】:2018-07-26 17:10:24
【问题描述】:
我制作了两个导航栏,但它不能正常工作。你有什么建议吗?它看起来像这样,但是在最小化之后我缺少 HOME MIB 和 LIBRARY 选项卡。我认为上层菜单涵盖了下层菜单。
我希望能够在单击菜单按钮后查看所有选项卡。
这是我的代码 啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊
<!DOCTYPE html>
<html lang="en">
<head>
<title>my site</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
body {
padding-top: 50px;
}
</style>
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="navbar-header">
<div class="navbar-header"><a class="navbar-brand" href="#">LOGO</a></div>
<button class="navbar-toggle" type="button" data-target=".navbar-collapse" data-toggle="collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav pull-right">
<li><a href="#">Friends</a></li>
<li><a href="#">Messages</a></li>
<li class="dropdown">
<a class="dropdown-toggle" href="#" data-toggle="dropdown">Account <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Settings</a></li>
<li><a href="#">Stats</a></li>
<li><a href="#">Logout</a></li>
</ul>
</li>
</ul>
</div>
</div>
<div class="navbar navbar-inverse navbar-static-top" role="navigation">
<div class="navbar-header">
<button class="navbar-toggle" type="button" data-target=".navbar-collapse" data-toggle="collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li><a href="#">Home</a></li>
<li class="dropdown">
<a class="dropdown-toggle" href="#" data-toggle="dropdown">MIB's <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">my MIB's</a></li>
<li><a href="#">my feedback's</a></li>
<li><a href="#">my comment's</a></li>
</ul>
</li>
<li class="dropdown">
<a class="dropdown-toggle" href="#" data-toggle="dropdown">Library <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Standard</a></li>
<li><a href="#">Random</a></li>
<li><a href="#">Custom</a></li>
</ul>
</li>
<li><a href="#">Badges</a></li>
<li class="dropdown">
<a class="dropdown-toggle" href="#" data-toggle="dropdown">Help <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">FAQ</a></li>
<li><a href="#">Contact</a></li>
</ul>
</li>
</ul>
</div>
</div>
</body>
</html>
【问题讨论】:
-
只需删除位置:已修复,它会显示所有内容
-
您好,移除固定位置后,我的菜单是分开的,它们带有 2 个菜单按钮 :( 我希望只有一个菜单按钮而不是单独的菜单栏 :)
标签: html twitter-bootstrap navbar