<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="css/bootstrap.css">
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.js"></script>
</head><body></body>以上代码是bootstrap的基本框架代码，然后在body里添加实际操作的代码。
1.栅格系统---row
<div class="row">
<div class="span12">
parent row1
<div class="row">
<div class="span3">child row1</div>
<div class="span5">child row2</div>
</div>
</div>
</div>以上代码嵌套的基本布局代码。span1到span12，是跨越的栅格列数。子容器里，所有的span*的和要小于等于12。
第二点可以从浏览器看出，它是与浏览器左对齐，并没有占一整行。文字也是左对齐。
2.流式栅格系统---row-fluid
<div class="row-fluid">
<div class="span12 btn-primary">
parent row1
<div class="row-fluid">
<div class="span6">child row1</div>
<div class="span6">child row2</div>
</div>
</div>
</div>同样以嵌套的形式演示。与基本布局不同的是，子容器里，所有的span*的和要等于12。
在浏览器中，它占一整行。文字也是左对齐
3.固定布局---container
<div class="container">
123
4 5
</div>该区域在浏览器center，左右都有margin。
浏览器显示 123 4 5
123是左对齐的，然后一个空格，4，一个空格，5。
可以分析出：div开始标签到第一个字符之间不管有多少个空格，都不算在内；第二个字符开始到下一个字符之间如果空格数大于等于1，都按一个空格来算。
4.流式布局
<div class="container-fluid btn-success">123 4
</div>占一整行，左右有padding。
div开始标签到第一个字符之间不管有多少个空格，都不算在内；第二个字符开始到下一个字符之间如果空格数大于等于1，都按一个空格来算。
以上是我对bootstrap2官网的文档一些理解。