Bootstrap学习笔记（五） 下拉菜单

用于显示链接列表的可切换、有上下文的菜单。下拉菜单的 JavaScript 插件让它具有了交互性

将下拉菜单触发器和下拉菜单都包裹在 .dropdown 里，或者另一个声明了 position: relative; 的元素。然后加入组成菜单的 HTML 代码

先导入js：

<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
<script src="js/bootstrap.js"></script>

<div class="dropdown">
    <button class="btn btn-primary" data-toggle="dropdown">我是一个下拉框 
    <span class="caret"></span></button>
    <ul class="dropdown-menu">
        <li><a href="#">python</a></li>
        <li><a href="#">c++</a></li>
        <li><a href="#">java</a></li>
    </ul>
</div>
<br/><br/><br/><br/><br/><br/>
<div class="dropup">
    <button class="btn btn-primary" data-toggle="dropdown">我是一个上拉框 
        <span class="caret"></span></button>
    <ul class="dropdown-menu">
      <li><a href="http://www.baidu.com">python</a></li>
      <li><a href="#">c++</a></li>
      <li><a href="#">java</a></li>
    </ul>
</div>