布局在前端开发中非常重要，布局是骨架是结构，就像房子的地基框架，设计优良的结构对整个页面的可维护性和扩展性都有很好的帮助。网页的样式可以变化多端，但是万变不离其宗，我们总结一下网页布局有哪些？他们如何设计比较合理。
经典布局
页面的经典布局如下图，它非常实用并且经久不衰，很多新的布局也是基于这种布局演变出来。
layout-classical.png
我们看看它的一些特点：
三列布局，中间宽度自适应，两边固定宽度；
整体水平居中；
整体宽度可以任意调整；
允许任意列的高度最高；
管理界面布局
管理界面的布局可以说是经典布局的一个演变：
layout-manage.png
三列或两列，中间宽度自适应，两边固定宽度；
整体宽度 100%；
整体高度相对浏览器可是区域 100%；
中间区域有滚动条；
流式布局
列表布局
列表的布局数据局部布局，但是也是一个非常常用的布局方式。
layout-list.png
整体宽度自适应；
每一列高度大于某一高度后自动变高；
左边可能有封面图或者 icon，宽度固定；
表单布局
表单布局非常常见：
layout-form.png
两列布局，左边固定右边自适应；
整体宽度自适应；
左边是表单项的名称，右边是表单输入项；
表单输入项内部的输入空间分情况占满输入项列；
其它
还有其它很多种不同的布局方式，我们未来再一一探讨：
手风琴布局
相应式布局
来自 “ ITPUB博客 ” ，链接：https://blog.itpub.net/4383/viewspace-2822708/ ，如需转载，请注明出处，否则将追究法律责任。
