【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>> 
在为大家介绍栅格布局原理之前，先带领大家了解一般的HTML页面布局。在页面布局中依次拥有以下几个板块：页头header、滚动图片banner、主体部分main、页脚footer。其中页头包含logo及导航栏nav，主体部分左右排布分为左侧content主题内容板块及右侧sideBar侧边栏板块。正如图1所示：
图1 页面主要模块
所以，常见的div布局代码如下：
为什么笔者要给大家介绍这个基本的盒子模型呢？是为了让大家了解一个页面中基本的几大模块是哪些或者说基本要有哪些元素，大家了解了之后就知道该把不同的内容放在各自不同的布局位置上，不要犯一些常识性的错误。
来源：oschina
链接：https://my.oschina.net/u/4125915/blog/3151185