css定位

1.相对定位

position : relative ;

/*

相对定位，相对于自己原来的位置进行定位

1. 如果是仅仅添加了相对定位的样式显示效果不发生变化

2. 如果添加了相对定位的样式 position:relative 显示效果不发生变化

3. 用 z-index 可以调整显示顺序

4. 原来的位置不会被其他元素占用

*/

2绝对定位

position : absolute ;

/* 绝对定位

1 找一个离他最近的，并且使用了定位的父元素 , 如果没有找到以 body 为标准

2. 元素原来位置会被占用

3 ：可以用 z-index 进行显示的顺序 */

值得注意的是，要有个使用了定位的父元素，可以给父元素添加position： relative元素

使用了绝对定位后，其后的元素会占用被定位元素的位置。

3.固定定位

position : fixed ;

固定定位是定位页面固定位置，随着页面的移动而移动

4.垂直水平居中

/* 让一个子元素垂直水平都居中的方法，

1 ，让子元素相对于父元素进行定位

2. 让子元素相对父元素两个方向都偏移 50%

3. 通过外边距对元素显示的位置进行修正，（本身宽高的一半） */

5.模块的顺序排放，并且优先加载也可以用定位来实现