Bootstrap网格系统
Bootstrap's网格系统最多允许跨页12列。
如果您不想单独使用全部12列，您可以将列，共同打造更宽的列：
| 跨度1 | 跨度1 | 跨度1 | 跨度1 | 跨度1 | 跨度1 | 跨度1 | 跨度1 | 跨度1 | 跨度1 | 跨度1 | 跨度1 |
| 跨度4 | 跨度4 | 跨度4 | |||||||||
| 跨度4 | 跨度8 | ||||||||||
| 跨度6 | 跨度6 | ||||||||||
| 跨度12 | |||||||||||
Bootstrap's网格系统响应，并且列将根据屏幕大小自动重新安排。
网格类
该Bootstrap网格系统有四种类型：
- xs （用于手机）
- sm （平板电脑）
- md （台式机）
- lg （较大的桌面）
这些类以上可以结合起来，创造出更多的活力和灵活的布局。
一个基本结构Bootstrap电网
以下是一个基本的结构， Bootstrap格：
<div
class="row">
<div class="col-*-*"></div>
</div>
<div
class="row">
<div class="col-*-*"></div>
<div class="col-*-*"></div>
<div class="col-*-*"></div>
</div>
<div
class="row">
...
</div> 第一; 创建一个行（ <div class="row"> ）。 然后，添加的列中的期望数目（代码具有适当.col-*-*的类）。 注意，在数字.col-*-*应该总是加起来12的每一行。
下面我们收集了基本的一些例子Bootstrap网格布局。
三等分列
.COL-SM-4
.COL-SM-4
.COL-SM-4
下面的例子说明如何获取起始于平板电脑和扩展到大型台式机三个等宽列。 在手机上，列会自动叠加：
例
<div class="row">
<div class="col-sm-4">.col-sm-4</div>
<div class="col-sm-4">.col-sm-4</div>
<div
class="col-sm-4">.col-sm-4</div>
</div> 试一试» 两个不相等的列
.COL-SM-4
.COL-SM-8
下面的示例演示了如何得到两个不同的宽度列起始于平板电脑和扩展到大型台式机：
例
<div class="row">
<div
class="col-sm-4">.col-sm-4</div>
<div
class="col-sm-8">.col-sm-8</div>
</div> 试一试» 提示：您将了解更多关于Bootstrap电网在本教程的后面。