清楚了CSS盒模型的基本概念、盒模型类型，以及包含块后，我们就可以深入探讨页布局的，模型了。布局模型与盒模型一样都是CSS最基、最核心的概念。但布局模型是建立在盒模型基础之上，又不同于我们常说的CSS布局样式或C布局模板。如果说布局模型是本，那么CSS模板就是末了，是外在的表现形式。CSS包含3种基本的布局模型，用英文概括为：Flow、Layer和Float。
1．Flow Model（流动模型）动模型是HTML默认布局模型，有人用normal表示，这种说法是可以理解的。实际上默认态下的HTML网页元素都是根据流动模型来分布网页内容的。所谓流动，顾名思义就如同流水一样，元素本身是被动的，它随着文档流自上而下按顺序动态布。流动布局只能根据元素排列的先后顺序来决定分布位置，要改变某个元素的位置，只能通过改变它在HTML文档流中的分布位置，所以说这是一种被动的布局模式。同时这种布局模式又是活动的，也就是说它的位置会随时发生改变，如果我们在元素前面增加另外一个元素，则它的位置会被向后推移。所有网页元素都以这种布局模型作为默认显示类型。流动布局模型的优势在于元素之间在错位、覆盖等问题，布局简单，符合人的浏览习惯。当然这种布局模型的弱点也是显而易见的，计师不能用单纯的流动布局模型设计出更艺术化的网页页面效果。
2．Layer Model（层模型）模型技术最早源于Netscape Navigator 4.0推出并支持的Layer（层）。Layer可以将页面的内容引入层的概念，希望像图像编辑器那样精确定位网页元素，摆脱HTML元素自然流动所带来的弊端，实现增强网页处理能力的目的。后来微软公司也看好这项新技术，预感到它的美好前景，于是新瓶换旧药，概念，希望与Netscape展开竞争，最终取得了胜利，但层布局并没有像当初微软设想得那么如意。微软全力打造的DHTML动态网页技术概念也在各种新技术的冲击下渐渐褪去本色。Layer对于广大Photoshop用户来说，可算是个法宝，然而在网页设计中，使用Layer却没有在图像编辑中那么风光无限。医用灭菌袋 灭菌袋封口机 硅橡胶印模材 齿科针
3．Float Model（浮动模型）浮动模型是CSS推出的一种布局模型，它汲取了前两者的优点，希望在流动与固定之间取得一个平衡，实现网页布局的自适应能力。层布局模型的败源于它没有认识到图像处理的对象是固定的，而网页永远都是一个活动的窗口，你无法预知不同浏览者所要使用的窗口大小，同时大部分网大小本身也是无法预测和控制的。有的网友把布局模型说成定位模型，我认为这是一种错误，因为定位是CSS布局中层龄本特征，它不能包含其他布局类型。还有人把网页布局模型分为：normal、float和absolute。我认为这种分法也欠妥当，两个概倒可以理解，第3个概念absolut就显得有点狭隘了，因为定位还包括fixed和relative两种定位类型，它们都属于层布局范畴内，我们不能把它分开来。这些概念是很重要的，对于设计师的布局具有重要指导意义，但由于各种错误的说法和观点流行于网上，使很多希望在网上获取营养的初学者深受其害。