在生成DOM树和CSSOM树之后，还是不能直接显示页面，它还需要生成布局树和布局计算。
一、创建布局树
在DOM树中，有很多元素是不能显示在页面上的，比如document、html、title、head、以及设置了display: none的元素。因此我们需要创建一个只包含可见元素的布局树。
如图所示，渲染引擎遍历DOM树和CSSOM树，对html、head等节点不添加到布局树中，display为none的节点也不会添加到布局树中。
二、布局计算
经过上面操作，我们已经拥有了布局树，但是要计算布局中各节点的坐标位置。
计算各节点的坐标位置的依据是css盒模型。
1、css盒子模型
标准的盒子模型=margin + border + padding + content；
设置盒子的width和height时，只是content的值。
IE的怪异模式将盒子的width和height定义为content + padding + border。
2、布局计算是从布局树的根节点开始递归遍历计算的。
