bootstrapt: Split button drop-down menu and Multiple buttons as additional elements--code implementation

<form action="...">
        <!--  作为额外元素的分裂式按钮下拉菜单   -->
        <div class = "input-group">
            <div class="input-group-btn">
                <button class="btn btn-default" >javaEE框架</button>
                <button class="btn btn-default dropdown-toggle" data-toggle="dropdown"><span class = "caret"></span></button>
                <ul class="dropdown-menu">
                    <li><a href="">spring</a></li>
                    <li><a href="">springboot</a></li>
                    <!-- divider 不需要包裹在 :超链接标签 a 内 -->
                    <li class="divider"></li>
                    <li><a href="">springmvc</a></li>
                </ul>
            </div>
            <input class="form-control" type="text">
        </div>
        
        <!--     Multiple buttons    -->
        <div class = "input-group">
            <div class="input-group-btn">
                <button id = "bt1" class="btn btn-default" ><span class="caret"></span></button>
                <button id = "bt2" class="btn btn-default" ><span class="glyphicon glyphicon-star"></span></button>
            </div>
            <input  type="text" class="form-control">
        </div>
</form>

1. Split button dropdown menu execution result as additional element:

Status after pull down:

2. Multiple buttons execution result:

 

Guess you like

Origin blog.csdn.net/lee_x_lee/article/details/111885470