css定位

定位层次> float> 普通文档流

z-intdex：n  控制层次的层叠关系，当为赋值的时候，就处于普通文档流的下面

float  是受文档流的影响的

绝对定位  不受文档流的影响，故其宽度就是内容的宽度，故需要为其设定宽度和高度

绝对定位于相对定位结合在一起进行使用

1 相对定位   作为父级

2 绝对定位   作为子级

一  绝对定位 

     1 脱离了文档流，不会单独战满一行

     2 他的位置

       （1）在其父级没有任何定位（绝对与相对定位），只受top   left  right  bottom  相对浏览器的位置影响

       （2）其父级有定位，那么top等就是针对其相应的最近的父级来说的，如果最近的父元素没有定位，就相对于boday，故其相对的对象是，定位的第一个父级元素

二 相对定位

        1 没有脱离文档流，会单独沾满相应方向的一行

        2 相对定位，是相对于块的最近的一个父元素

        3 就是相对于自己，在默认文档流中的正常定位，进行定位的

三 固定定位

       1 脱离了文档流，不会单独占满一行

       2 其位置是相对于body来讲的，不随页面滚动，而移动

       注释：top  left  right  bottom等都是针对定位来说的，单独设置是不起作用的（绝对 固定 相对  才起作用），其参照的对象是相对的定位的对象

四 float

       1  浮动就是，所谓脱离文档流，就是其悬浮，不占据位置，直到碰到边缘或者父级元素，或者前一个浮动，我的理解就是相当于，又建立一个层次

       2 但是最内容不受影响（盒子内容不受影响），如文字和图片，这样就可以制造文字环绕的效果

       3  clear  清除其周围，对其的影响，那一侧对其影响，就清除那一侧

       4  其父级元素（其父级元素只有浮动），搞的没有高度了（当没有给父级元素设定高度的时候），就会出现塌陷问题，塌陷的问题解决，对其父级元素，加上如下的类

           .clearfix{zoom:1;}   zoom  是ie浏览器专属，就是为了兼容ie浏览器

           .clearfix:after{content:".";display:block;visibility:hidden;height:0;clear:both;}  这句的意思，就是在加上一些内容，并且将其设置不占用高度，不可见（保留了物理空间）