bootstrap入门学习心得
在head之间用 link标签引入基本样式表 rel="stylesheet" href="mb/bootcss/css/bootstrap.min.css" rel="stylesheet" href="mb/bootcss/css/bootstrap-theme.min.css" >
第二步：引用栅格系统1.引入容器div 类名为container，则居中显示，类名为container-fluid则全屏显示
2.在container容器div内引入布局div 类名为row，即一行，实际也是容器的意思，不放具体内容
3.真正布局在row容器div内引入布局列div 类名为col-lg-*，*号为1-12的数字，bootsrap将屏幕分成12等份，各列数字为所占的等份，各列数字的和恰好等于12,则会保持在同一行，超过12则另起一行显示，lg是指大屏幕
第三步：样式解读1.字体：1-6号标题
h1标题效果
h2标题效果
h3标题效果
h4标题效果
h4标题效果
h5标题效果
h6标题效果
2.字体：副标题，字体变小变灰,作用不明显
成对的small标签：
h1标题效果直接在h1h6之间放置
3.Bootstrap 将全局 font-size 设置为 14px，line-height 设置为 1.428。这些属性直接赋予 body 元素和所有段落元素。另外，p （段落）元素还被设置了等于 1/2 行高（即 10px）的底部外边距（margin）。
4.文本对齐样式
左对齐：类名text-left
居中对齐：类名text-center
右对齐：类名text-right
5.列表介绍
无序列表ul li有序列表ol li
6.表格介绍
table 类可以为其赋予基本的样式，通过 .table-striped 类可以给 tbody 之内的每一行增加斑马条纹样式 添加 .table-bordered 类为表格和其中的每个单元格增加边框。 通过添加 .table-hover 类可以让 tbody 中的每一行对鼠标悬停状态作出响应。 通过这些状态类可以为行或单元格设置颜色。.active 鼠标悬停在行或单元格上时所设置的颜色
.success 标识成功或积极的动作
.info 标识普通的提示信息或动作
.warning 标识警告或需要用户注意
.danger 标识危险或潜在的带来负面影响的动作
响应式表格 将任何 .table 元素包裹在 .table-responsive 元素div内，即可创建响应式表格，其会在小屏幕设备上（小于768px）水平滚动。当屏幕大于 768px 宽度时，水平滚动条消失。
7.表单多行和单行
内联表单 为 form 元素添加 .form-inline 类可使其内容左对齐并且表现为 inline-block 级别的控件。只适用于视口（viewport）至少在 768px 宽度时（视口宽度再小的话就会使表单折叠）。 可能需要手动设置宽度 在 Bootstrap 中，输入框和单选/多选框控件默认被设置为 width: 100%; 宽度。在内联表单，我们将这些元素的宽度设置为 width: auto;，因此，多个控件可以排列在同一行。根据你的布局需求，可能需要一些额外的定制化组件。 焦点状态 我们将某些表单控件的默认 outline 样式移除，然后对 :focus 状态赋予 box-shadow 属性。控件尺寸 通过 .input-lg 类似的类可以为控件设置高度，通过 .col-lg-* 类似的类可以为控件设置宽度。
9.按钮：预定义样式 使用下面列出的类可以快速创建一个带有预定义样式的按钮。
需要让按钮具有不同尺寸吗？使用 .btn-lg、.btn-sm 或 .btn-xs 就可以获得不同尺寸的按钮。
10.图片
在 Bootstrap 版本 3 中，通过为图片添加 .img-responsive 类可以让图片支持响应式布局。其实质是为图片设置了 max-width: 100%;、 height: auto; 和 display: block; 属性，从而让图片在其父元素中更好的缩放。 如果需要让使用了 .img-responsive 类的图片水平居中，请使用 .center-block 类，不要用 .text-center。 请参考助手类章节 了解更多关于 .center-block 的用法。
class="img-rounded" class="img-circle" class="img-thumbnail"
11.清除浮动 通过为父元素添加 .clearfix 类可以很容易地清除浮动（float）。这里所使用的是 Nicolas Gallagher 创造的 micro clearfix 方式。此类还可以作为 mixin 使用。
12.按钮工具栏 尺寸 只要给 .btn-group 加上 .btn-group-* 类，就省去为按钮组中的每个按钮都赋予尺寸类了，如果包含了多个按钮组时也适用。
13.导航栏
支持的内容 导航栏内置了对少数子组件的支持。根据需要从以下选项中进行选择： ¥Navbars come with built-in support for a handful of sub-components. Choose from the following as needed: .navbar-brand 代表你的公司、产品或项目名称。 ¥.navbar-brand for your company, product, or project name. .navbar-nav 用于全高和轻量级导航（包括对下拉菜单的支持）。 .navbar-toggler 与我们的折叠插件和其他 导航切换 行为一起使用。 适用于任何表单控件和操作的 Flex 和间距工具。 .navbar-text 用于添加垂直居中的文本字符串。 .collapse.navbar-collapse 用于通过父断点分组和隐藏导航栏内容。 ¥.collapse.navbar-collapse for grouping and hiding navbar contents by a parent breakpoint. 添加可选的 .navbar-nav-scroll 以设置 max-height 和 滚动展开的导航栏内容。
