2、两列布局：说起两列布局，最常见的就是使用float来实现。float浮动布局的缺点是浮动后会造成文本环绕等效果，以及需要及时清除浮动。
3、三列布局：两侧定宽中间自适应,首先设置父级元素的宽度，可以左左右设置浮动。然后中间设置margin调整间距。 也可以都设置成左浮动，设置margin，调整间距。同样注意清除浮动的影响。
4、混合布局：在一列布局的基础上，保留top和foot部分，将中间的main部分改造成两列或三列布局，小的模块可以再逐级同理划分。
实现网页布局的方式方法比较多，布局方式可以大概分为这几类。布局种类：
1、table布局（网页的兴起，1995）
2、Flash布局（自由的黄金时代，1996）
3、div+css（CSS的诞生，1998）
4、栅格与响应式（移动端的兴起，2007与2010）
当前WEB前端开发使用DIV+CSS的布局方式会比较多也比较常用吧，网页布局看起来貌似简单，但是它需要综合使用很多HTML+CSS的知识，总的来说知识量是不小。如果想系统化的了解HTML+CSS方面的知识，建议你选择一本比较不错的HTML5相关书籍（主要看知识逻辑、知识的表达方式，比如《HTML5布局之路》）进行学习，让自己的知识更扎实一些，不然学的零零散散的。
Tips：学习好HTML+CSS有利于后面学习JavaScript，毕竟需要它们两者结合在一起才可以实现出可交互的前端页面。
设计师给图，前端根据图还原效果写代码。如果页面结构较小的话，可以先写大的框架，然后写细节，一步步完成。1.写基本的框架，头部，主要部分，底部等；
2.把大的部分继续细化，直至写出所有html代码；
3.样式写法开始，css rest；
4.利用border或者background区分各个块；
5.给各个区块设置基本属性宽高，浮动，定位构成大概；
6.依次细化区块，设置填充和边距，字体大小，颜色样式；
7.背景位置及其它细节。
