有关定位（position）遇到的问题

一、常用的定位

1、相对定位

position:    relative;   //相对定位，通常用到父盒子上，

相对于元素在正常的文档流中的位置移动它，把一个正常布局流中的元素从它的默认位置按坐标进行相对移动。它原本所占的空间不会改变。

2、position:absolute绝对定位

通常配合绝对定位使用（父相子绝）结合实际案例，如焦点图中的分页，翻页，视频网站中的 vip标签等，如果没有设置其他定位元素，它会以body作为参考系。

3、 position:fixed 固定定位

元素的位置相对于浏览器窗口是固定位置。即使窗口是滚动的它也不会移动，通常应用为相对于窗口定位的元素如弹窗、跟随滚动的导航、侧边栏。

二、定位的重要应用

1、实现盒子居中的方法

.center{

            position: absolute;  //一定要设置定位

            left: 0;

            top: 0;

            right: 0;

            bottom: 0;

            margin: auto;

        }

2、盒子的层级（层级为前后展示顺序）

1）默认情况下，结构越靠下，层级越大，在上方。

2） z-index: n;  n为层级数，n越大越靠上，可为负值，当它为负值时放在父盒子的下方。

     在不同父盒子下的子盒子设置这个N不能对这两个子盒子生效。父盒子层级低，子盒子设置的再高也只能在父盒子生效。