Bootstrap按钮组

最新推荐文章于 2023-03-16 15:00:46 发布

侠之大者为国为民

最新推荐文章于 2023-03-16 15:00:46 发布

阅读量288

点赞数

分类专栏： bootstrap 文章标签： bootstrap

bootstrap 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

<div class="btn-toolbar" role="toolbar">
        <div class="btn-group btn-group-lg">
            <button type="button" class="btn btn-default">Button1</button>
            <button type="button" class="btn btn-default">Button2</button>
        </div>
        <div class="btn-group btn-group-sm">
            <button type="button" class="btn btn-default">Button1</button>
            <button type="button" class="btn btn-default">Button2</button>
        </div>
        <div class="btn-group btn-group-xs">
            <button type="button" class="btn btn-default">Button1</button>
            <button type="button" class="btn btn-default">Button2</button>
        </div>
    </div>
    <div class="btn-toolbar" role="toolbar">
        <div class="btn-group-vertical btn-group-lg">
            <button type="button" class="btn btn-default">Button1</button>
            <button type="button" class="btn btn-default">Button2</button>
        </div>
        <div class="btn-group-vertical btn-group-sm">
            <button type="button" class="btn btn-default">Button1</button>
            <button type="button" class="btn btn-default">Button2</button>
        </div>
        <div class="btn-group-vertical btn-group-xs">
            <button type="button" class="btn btn-default">Button1</button>
            <button type="button" class="btn btn-default">Button2</button>
        </div>
    </div>
    <div class="btn-group">
        <button type="button" class="btn btn-default">按钮 1</button>
        <button type="button" class="btn btn-default">按钮 2</button>
        <div class="btn-group">
            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
        下列
        <span class="caret"></span>
    </button>
            <ul class="dropdown-menu">
                <li><a href="#">下拉链接 1</a></li>
                <li><a href="#">下拉链接 2</a></li>
            </ul>

        </div>
        <div class="btn-group">
            <button type="button" class="btn btn-default  dropdown-toggle" data-toggle="dropdown">
        下列2
        <span class="caret"></span>
    </button>
            <ul class="dropdown-menu">
                <li><a href="#">下拉链接 3</a></li>
                <li><a href="#">下拉链接 4</a></li>
            </ul>

        </div>
    </div>