<div>之定位

在使用盒子模型的过程中，如何放置各种类型的“盒子”，就存在定位、浮动等问题。下面就日常运用过程中出现过的情况总结如下（陆续加入中....）

一、图片直接做<div>的背景

 在<div>配合使用<img>的过程中，如果在<div>中直接使用<img>，就不存在指定<div>的高度及宽度的问题，因为<img>作为行级元素，根据其自身的情况（高度及宽度）能够占有一部分空间，这样就能够正常显示。如果图片不做为一个单独的元素，而是做为<div>的一个属性——背景图片来进行处理，就必须指定高度及宽度（此时的高度及宽度均为0px）。

二、浮动元素的定位

元素通过float后，虽然脱离了文档流（也就是不受html的从上到下、从左至右的一个文档顺序），但是它还是存在一个显示、定位的问题。特征一：浮动元素的定位与普通元素的定位一样，还是基于正常的文档流，从文档流抽出后尽可能的移动至左边或者右边；特征二：文字内容会围绕在它周围（其它块级元素会处在它的下面，行级元素围绕在它的周围）；特征三：在文档流中的其它元素会填补它的位置。

基于以上特征,在进行float后，再进行positoin定位，根据需要，选择absolute、fix、relative中的一种方式。