转载

输入框组被分割的下拉菜单按钮

输入框组带有分割的下拉菜单按钮按钮

在输入框组中添加带有下拉菜单按钮的分割按钮,使用与下拉菜单按钮按钮大致相同的样式,但是对下拉菜单按钮添加了主要的下拉菜单按钮演示,如下面的实例所示:

作为额外元素的分裂式按钮下拉菜单按钮

  • Action
  • Another action
  • Something else here
  • Separated link
  • Action
  • Another action
  • Something else here
  • Separated link
 <div class="row">      <div class="col-lg-6">     <div class="input-group">     <div class="input-group-btn">        <button class="btn btn-default" tabindex="-1" type="button">下拉菜单按钮</button>        <button class="btn btn-default dropdown-toggle" data-toggle="dropdown" tabindex="-1" type="button">           <span class="caret">&nbsp;</span>            <span class="sr-only">切换下拉菜单按钮</span>        </button>        <ul class="dropdown-menu">        <li><a href="#">下拉菜单按钮演示</a></li>        <li><a href="#">另一个下拉菜单按钮演示</a></li>        <li><a href="#">其他</a></li>        <li class="divider">&nbsp;</li>        <li><a href="#">分离的下拉菜单按钮</a></li>        </ul>     </div> <!-- /btn-group -->     <input class="form-control" type="text"></div> <!-- /input-group -->     </div> <!-- /.col-lg-6 -->       <div class="col-lg-6">     <div class="input-group">     <input class="form-control" type="text">     <div class="input-group-btn">     <button class="btn btn-default" tabindex="-1" type="button">下拉菜单按钮</button>     <button class="btn btn-default dropdown-toggle" data-toggle="dropdown" tabindex="-1" type="button">        <span class="caret">&nbsp;</span>         <span class="sr-only">切换下拉菜单按钮</span>     </button>     <ul class="dropdown-menu pull-right">     <li><a href="#">下拉菜单按钮演示</a></li>     <li><a href="#">另一个下拉菜单按钮演示</a></li>     <li><a href="#">其他</a></li>     <li class="divider">&nbsp;</li>     <li><a href="#">分离的下拉菜单按钮</a></li>     </ul>     </div><!-- /btn-group -->     </div><!-- /input-group -->     </div><!-- /.col-lg-6 -->  </div> 
正文到此结束
Loading...