Bootstrap

Bootstrap

一、布局容器

Bootstrap需要为页面内容和栅格系统包裹一个.container容器。框架中提供了两个类

.container 类

用于固定宽度并支持响应式布局的容器

<div class = "container">
...
</div>

.container-fluid 类

用于100%宽度，占据全部视口（viewport）的容器。

<div class="container-fluid">
...
</div>

注意：由于padding等属性的原因，这两个容器类不能相互嵌套。

二、栅格系统

Bootstrap提供了一套响应式、移动设备优先的流式栅格系统，

随着屏幕或视口（viewport）尺寸的增加，系统会自动分为最多12列。

三、表格

在Bootstrap里，给标签

添加。table类可以为其赋予基本样式——少量的内补（padding）和水平方向的分隔线

四、表单

• 单独的表单控件会被自动赋予一些全局样式
• 所有设置了.from-control类的,和元素都将被默认设置宽度属性为width：100%；。将label元素和前面提到的控件包裹在.form-group中可以获得最好的排列

五、按钮

• 可作为按钮使用的标签或元素
• 为,,元素添加按钮类（button class）即可使用Bootstrap提供的样式