我在我的网站上添加了Bootstrap Dropdowns,其中一个根本不起作用。点击时其他三个掉落,但是相当混乱。我无法让小提琴工作,所以这里有一个搞砸了的截图和一些实际的“下拉”部分出现在左边的截图,所以你明白了。
HTML:
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<div class="container">
<div class="dropdown">
<button class="btn btn-success dropdown-toggle" type="button" data-toggle="dropdown">Example
<span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li class="dropdown-header"><b>Example</b></li>
<li><a href="example1.html">Example 1</a></li>
<li><a href="example2.html">Example 2</a></li>
<li><a href="example3.html">Example 3</a></li>
<li><a href="example4.html">Example 4</a></li>
<li><a href="example5.html">Example 5</a></li>
</ul>
</div>
</div>
我不是在添加CSS或JavaScript,因为它只是Bootstrap。如果有人能发现我的问题,我们将非常感激。
答案 0 :(得分:2)
你错过了div包装应该有.dropdown
这是一个小提示,显示它正在运作Fiddle Demo
它应如下所示:
<div class="container">
<div class="dropdown">
<button class="btn btn-success dropdown-toggle" type="button" data-toggle="dropdown">Example
<span class="caret"></span></button>
<ul class="dropdown-menu">
<li class="dropdown-header"><b>Example</b></li>
<li><a href="example1.html">Example 1</a></li>
<li><a href="example2.html">Example 2</a></li>
<li><a href="example3.html">Example 3</a></li>
<li><a href="example4.html">Example 4</a></li>
<li><a href="example5.html">Example 5</a></li>
</ul>
</div>
</div>