前端position方法总结

position为absolute时不占空间，因此会出现覆盖的情况，父套子应该为需要调整的div为父，在其内再增加div为子，则和其他元素位置不变，可实现z-index

 

1、position:static 无定位

该属性值是所有元素定位的默认情况，在一般情况下，不需要特别声明，但遇到继承情况，不愿意见到元素所继承的属性影响本身，可使用该方法取消继承，即还原元素定位的默认值

 

2、position:absolute 绝对定位

能很准确将元素移到你想要的位置，nav移到右上角：

nav{position:absolute;top:0;right:0;width:200px;}

使用绝对定位的前面或后面的层会认为这个层并不存在，也就是在z方向上，它是相对独立出来的，丝毫不影响到其他z方向的层。

不适合相对附近层确定位置。

 

3、position:fixed 相对于窗口的固定定位

包含块是视区本身，元素在文档滚动时不会在浏览器视察中移动。允许框架样式布局

IE6不支持该属性

 

4、position:relative 相对定位

相对于元素默认的位置的定位，top、bottom、left、right

相对定位紧随他的层woaicss是不会出现在nav的下方，而是和nav发生一定的重叠