CSS里的定位问题【div的用法】

目前开发页面，用到的的是div+css布局，table式布局可以说是已逐渐淘汰，所谓的是div+css，意思是把页面分解成不同的区域

1. 把页面分成上中下，顶部的header是一个div（把div当成一个容器、盒子），中间部分也是一个div，这个是一个大盒子，在大盒子里面装了三个小盒子，分别是sub、main、extra，你可看成【左侧+右侧+中间】，底部的盒子也是一个div。
2. 之所以能让盒子在合适在位置，需要用css来控制，这就是div+css布局，页面的布局，最常用的是定位，div+css，而定位是属于CSS的内容，div+css，盒子关系，无非就是盒子内的嵌套，大盒子包含小盒子。
3. 如果需要定位，那肯定需要参照物，定位的核心就是找对参照盒子，子盒子需要定位，先确定参照盒子是谁，如果参照盒子是父盒子，那么要做下面两步：

第一步、父盒子中添加属性position: relative； 第二步、子盒子中添加属性position:absolute，

接下来你就可以随意控制子盒子在页面上的位置，只需要记住这个关系，再复杂的都可以解决了，要注意一点的是：

• 子元素设置了属性position:absolute，那么子元素会去寻找参照对象，这个参照对象就是设置了属性值为position:relative或者position:absolute的盒子；
• 如若子元素设置了绝对定位，其它的任何节点元素都没有设置定位为position:relative或者position:absolute，那么子元素就会把body当做参照对象。