前端学习第六天——定位position及万能居中公式

定位（position）

一、静态定位（static）

默认都是静态定位，相当于没有。

二、相对定位（relative）

偏移时的参考物：定位前自己本身的位置。

特点：1、定位后不影响元素本身的特性。
2、元素不会脱离文档流。
3、相对于原位置进行偏移。

三、绝对定位（absolute）

偏移时的参照物：最近一级使用了定位的父级，没有找body.

特点：1、元素会脱离文档流。
2、行元素支持所有的CSS样式。
3、块元素默认内容撑开宽高。
4、清楚子级浮动。

四、固定定位（fixed）

参照物：浏览器

特点：1、元素脱离文档流。
2、清楚子级浮动。

五、定位的作用

1、可使用偏移进行描述
top、right、bottom、left
2、可以使用z-index提升层级

附加：

万能居中公式

position: absolute;
            left: 50%;
            top: 50%;
            margin-left: -width/2;
            margin-top: -height/2;