BootStrap--CSS组件--按钮组(btn-group)

最新推荐文章于 2024-04-16 11:12:01 发布

github_34514750

最新推荐文章于 2024-04-16 11:12:01 发布

阅读量5.9k

点赞数 1

分类专栏： BootStrap 文章标签： BootStrap CSS组件按钮组

本文链接：https://blog.csdn.net/github_34514750/article/details/53693926

版权

.btn-toolbar(有助于几组btn-group结合到一个btn-toolbar中)/.btn-group(btn-group-lg/btn-group-sm/btn-group-xs)/.btn-group-vertical
容器内的按钮，可以使用button元素，也可以使用a元素，产生的效果是一样的。

容器的多个分组以table风格进行显示，每组之间保持5px的left margin

//源码
.btn-toolbar:before,
.btn-toolbar:after{
    display:table;
    content:" ";
}
.btn-toolbar:after{
    clear:both;
}

.btn-toolbar {
  margin-left: -5px;
}
.btn-toolbar .btn,
.btn-toolbar .btn-group,
.btn-toolbar .input-group {
  float: left;
}
.btn-toolbar > .btn,
.btn-toolbar > .btn-group,
.btn-toolbar > .input-group {
  margin-left: 5px;
}

例子见按钮组.html–普通分组，嵌套分组，垂直分组

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- Bootstrap从3.0版本开始全面支持移动平台，贯彻移动先行宗旨 -->
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>Bootstrap 101 Template</title>

    <!-- Bootstrap

最低0.47元/天解锁文章

github_34514750

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
BootStrap--CSS组件--按钮组(btn-group)

.btn-toolbar(有助于几组btn-group结合到一个btn-toolbar中)/.btn-group(btn-group-lg/btn-group-sm/btn-group-xs)/.btn-group-vertical 容器内的按钮，可以使用button元素，也可以使用a元素，产生的效果是一样的。容器的多个分组以table风格进行显示，每组之间保持5px的left margin//源
复制链接

扫一扫