再来一篇定位

定位
元素的定位属性
元素的定位属性主要包括定位模式和边偏移两个部分
1、边偏移
2、定位模式
在CSS中 position 属性用于定义元素的定位模式 其基本语法格式如下 : 
选择器 { position: 属性值; }
position属性的常用值

静态定位(static)
在静态定位状态下 无法通过边偏移属性(top、bottom、left或right)来改变元素的位置
ps: 静态定位 对于边偏移是无效的 一般他用来清除定位 一个原来有定位的盒子 不想加定位了 就用 position:static 

相对定位relative
注意 : 
1. 相对定位最重要的一点是 他可以通过边偏移移动位置 但是原来的所占的位置 继续占有
2. 其次 每次移动的位置 是以自己的左上角为基点移动(相对于自己来移动位置)
就是说 相对定位的盒子 仍在标准流中 他后面的盒子仍以标准流方式对待他 (相对定位不脱标)

绝对定位absolute
当position属性的取值为absolute时 可以将元素的定位模式设置为绝对定位
注意: 他可以通过边偏移移动位置 绝对定位是完全脱标的 不占有位置

父级没有定位
若所有父元素都没有定位 那么以浏览器为准对齐(document文档)
父级有定位
绝对定位是将元素依据最近的已经定位(绝对、固定或相对定位)的父元素(祖先)进行对位

子绝父相
1. 子级是绝对定位 不会占有位置 可以放到父盒子里面的任何一个地方
2. 父盒子布局时 需要占有位置 因此父亲只能是相对定位

绝对定位的盒子水平/垂直居中
普通的盒子时左右margin改为auto就可以了 但是对于绝对定位就无效了
定位的盒子也可以水平或者垂直居中 有一个算法
1. 首先 left 50% 父盒子的一半
2. 然后走自己外边距负的一半值就可以了 margin-left: 左走自己宽度的一半;

<