Twitter bootstrap boostrap 3.1.1导航栏-切换按钮未出现在页面上
我正在尝试使用带切换功能的引导导航栏。 对于下面的示例代码,我的页面没有在标题栏上显示切换按钮。 NavHeader(NavBarMenuOptions)和第一个菜单项出现在同一行 引导链路 下面的代码可能有什么错误Twitter bootstrap boostrap 3.1.1导航栏-切换按钮未出现在页面上,twitter-bootstrap,twitter-bootstrap-3,navbar,Twitter Bootstrap,Twitter Bootstrap 3,Navbar,我正在尝试使用带切换功能的引导导航栏。 对于下面的示例代码,我的页面没有在标题栏上显示切换按钮。 NavHeader(NavBarMenuOptions)和第一个菜单项出现在同一行 引导链路 下面的代码可能有什么错误 <!DOCTYPE html> <html> <head> <title>Bootstap menu demo</title> <link rel="stylesheet" href
<!DOCTYPE html>
<html>
<head>
<title>Bootstap menu demo</title>
<link rel="stylesheet" href="vendor/bootstrap-3.1.1-dist/css/bootstrap.min.css">
</head>
<body>
<h2>This is bootstap navbar demo</h2>
<nav class="navbar navbar-default">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#example-navbar-collapse">
<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="#">NavBarMenuCaption</a>
</div>
<div class="navbar-collapse collapse" id="example-navbar-collapse">
<ul class="nav nav-pills nav-stacked">
<li ><a href="#">Home</a></li>
<li class="active"><a href="#">About</a></li>
<li><a href="#">Products</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
</nav>
<script type="text/javascript" src="vendor/jquery-2.1.0/jquery-2.1.0.min.js"></script>
<script type="text/javascript" src="vendor/bootstrap-3.1.1-dist/js/bootstrap.min.js"></script>
</body>
Bootstap菜单演示
这是bootstap导航栏演示
切换导航
-
-
-
更改:
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#example-navbar-collapse">
致:
以及:
致:
切换按钮应该出现
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<ul class="nav nav-pills nav-stacked">
<ul class="nav navbar-nav">