Bootstrap教程按钮式下拉菜单

文章目录[隐藏]

按钮式下拉菜单把任意一个按钮放入 .btn-group 中，然后加入适当的菜单标签，就可以让按钮作为菜单的触发器了。

实例：

  <button type="button" class="btn btn-Default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

    <li><a href="#">Another action</a></li>

    <li><a href="#">Something else here</a></li>

    <li role="separator" class="divider"></li>

    <li><a href="#">Separated link</a></li>

实例：

  <button type="button" class="btn btn-danger">Action</button>

  <button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

    <span class="sr-only">Toggle Dropdown</span>

    <li><a href="#">Another action</a></li>

    <li><a href="#">Something else here</a></li>

    <li role="separator" class="divider"></li>

    <li><a href="#">Separated link</a></li>

实例：

      <button type="button" class="btn btn-default dropdown-toggle"  data-toggle="dropdown">  默认 <span class="caret"></span></button>

      <ul class="dropdown-menu" role="menu">

         <li><a href="#">功能</a></li>

         <li><a href="#">另一个功能</a></li>

         <li><a href="#">其他</a></li>

         <li><a href="#">分离的链接</a></li>

      <button type="button" class="btn btn-primary dropdown-toggle"  data-toggle="dropdown">  原始 <span class="caret"></span>      </button>

      <ul class="dropdown-menu" role="menu">

         <li><a href="#">功能</a></li>

         <li><a href="#">另一个功能</a></li>

         <li><a href="#">其他</a></li>

         <li><a href="#">分离的链接</a></li>

511遇见