下拉菜单换行并且下拉菜单没有折叠。它以列表形式显示自己。 Java脚本有问题吗？
我正在使用 bootstrap v3.3.4 和 jquery v2.1.2。我在 bootstrap.min.js 之前放置了 Jquery 脚本。
<!DOCTYPE html>
<html>
<head>
<title>Shaunta's Botique</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/main.css">
<meta name="viewport" content="width=device-width, initial scale=1, user-scalable=" no ">
<script src="https://code.jquery.com/jquery-2.1.2.min.js "
integrity="sha256-YE7BKn1ea9jirCHPr/EaW5NxmkZZGb52+ZaD2UKodXY="
crossorigin=" anonymous "></script>
<script src="js/bootstrap.min.js "></script>
<script src="js/tether.min.js "></script>
</head>
<body>
<!-- Top Nav Bar -->
<nav class="navbar navbar-default navbar-fixed-top ">
<div class="container ">
<a class="navbar-brand " href="index.php ">Shaunta's Botuqie</a></div>
<ul class="nav navbar-nav ">
<li class="dropdown ">
<a href="# " class="dropdown-toggle " data-toggle="dropdown ">Men <span class="caret "></span></a>
<ul class="dopdown-menu " role="menu ">
<li><a href=" ">Shirts</a></li>
<li><a href=" ">Pants</a></li>
<li><a href=" ">Shoes</a></li>
<li><a href=" ">Accessories</a></li>
</ul>
</li>
</ul>
</div>
</nav>
<!-- Header -->
<div id="header-wrapper ">
</div>
</body>
</html>
最佳答案
您的代码中有一些拼写错误。类应该是 dropdown-menu
<ul class="dopdown-menu " role="menu ">
还缺少一些属性，例如 aria-expanded 和 aria-labelledby。我根据 Bootstrap 的引用添加了这些属性 documentation .
所以最终的标记看起来像-
<nav class="navbar navbar-default navbar-fixed-top ">
<div class="container ">
<a class="navbar-brand" href="index.php ">Shaunta's Botuqie</a></div>
<ul class="nav navbar-nav">
<li class="dropdown">
<a class=" dropdown-toggle" id="dropdownMenu1" data-toggle="dropdown" aria-expanded="true">
Men
<span class="caret"></span>
</a>
<ul class="dropdown-menu " role="menu " aria-labelledby="dropdownMenu1">
<li><a href=" ">Shirts</a></li>
<li><a href=" ">Pants</a></li>
<li><a href=" ">Shoes</a></li>
<li><a href=" ">Accessories</a></li>
</ul>
</li>
</ul>
</div>
</nav>
请引用此工作fiddle .
关于jquery - Bootstrap 下拉菜单充当 block 级元素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/49849624/