将下拉菜单触发器和下拉菜单都包裹在 .dropdown 里,或者另一个声明了 position: relative; 的元素。然后加入组成菜单的 HTML 代码。下面的实例演示了基本的下拉菜单:
<!DOCTYPE html><html><head><title>Bootstrap 实例 - 下拉菜单(Dropdowns)</title>
<link href="/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<script src="/scripts/jquery.min.js"></script>
<script src="/bootstrap/js/bootstrap.min.js"></script>
</head><body><div class="dropdown">
<button type="button" class="btn dropdown-toggle" id="dropdownMenu1"
data-toggle="dropdown">
技术归档
<span class="caret"></span>
</button><ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
<li role="presentation">
<a role="menuitem" tabindex="-1" href="#">Java</a>
</li><li role="presentation">
<a role="menuitem" tabindex="-1" href="#">Wordpress</a>
</li><li role="presentation">
<a role="menuitem" tabindex="-1" href="#">Bootstrap</a>
</li><li role="presentation" class="divider"></li>
<li role="presentation">
<a role="menuitem" tabindex="-1" href="#">Query/js</a>
</li></ul></div></body></html>
