CSS定位

参考链接

http://www.cnblogs.com/chinafine/articles/1765967.html

http://www.ipmtea.net/css/201010/09_335.html

http://www.cnblogs.com/polk6/p/3214847.html

position-fixed固定定位，能单独使用，脱离文档流

比如html5中导航，tab定位，一般相对于body定位

fixed是特殊的absolute，即fixed总是以body为定位对象的

position:absolute绝对定位，不能单独使用，需要父亲position属性，脱离文档流

需要设置父div的position属性，设定好了之后相当于父div进行定位

给定一个div取名sub1的position设置为absolute后，其到底以谁为对象进行偏移呢？这里分为两种情况：

（1）当sub1的父对象parent也设置了position属性，且position的属性值为absolute或者relative

也就是说，不是默认值的情况，此时sub1按照这个parent来进行定位。注意，对象虽然确定好了，但有些细节需要您的注意，那就是我们到底以parent的哪个定位点来进行定位呢？如果parent设定了margin，border，padding等属性，那么这个定位点将忽略padding，将会从padding开始的地方(即只从padding的左上角开始)进行定位，这与我们会想当然的以为会以margin的左上端开始定位的想法是不同的。接下来的问题是，sub2的位置到哪里去了呢由于当position设置为absolute后，会导致sub1溢出正常的文档流，就像它不属于parent一样，它漂浮了起来，在DreamWeaver中把它称为“层”，其实意思是一样的。此时sub2将获得sub1的位置，它的文档流不再基于sub1，而是直接从parent开始。

这里有个注意的地方是sub1脱离了文档流到新的定位地方时，就会显示显示自身大小，这个时候可以加100%来显示

（2）如果sub1不存在一个有着position属性的父对象

那么那就会以body为定位对象，按照浏览器的窗口进行定位，这个比较容易理解。

position:relative相对定位，相对应本身自己进行定位，能单独使用，未脱离文档流

比如有两个div一个div1一个div2此时正常排版时候div2紧跟着div1进行排列，此时如果需要div2重叠div1此时可以用position:relative来进行真对自身进行相对定位

相关属性topleftbottomright

position:static默认定位，不起作用，一般不设置，未脱离文档流

默认情况下div的属性