将position设置为absolute/fixed元素的特点

◼ 绝对定位元素脱离标准流
◼ 可以通过left、right、top、bottom进行定位
 定位参照对象是最邻近的定位祖先元素
 如果找不到这样的祖先元素，参照对象是视口

在绝大数情况下，子元素的绝对定位都是相对于父元素进行定位
◼ 如果希望子元素相对于父元素进行定位，又不希望父元素脱标，常用解决方案是：
 父元素设置position: relative（让父元素成为定位元素，而且父元素不脱离标准流）
 子元素设置position: absolute
 简称为子绝父相

absolute/fixed元素的特点

◼ 可以随意设置宽高

◼ 宽高默认由内容决定

◼ 不再受标准流的约束

 不再严格按照从上到下、从左到右排布

 不再严格区分块级(block)、行内级(inline)，行内块级(inline-block)的很多特性都会消失

◼ 不再给父元素汇报宽高数据

◼ 脱标元素内部默认还是按照标准流布局

◼ 绝对定位元素（absolutely positioned element）

 position值为absolute或者fixed的元素

◼ 对于绝对定位元素来说

 定位参照对象的宽度 = left + right + margin-left + margin-right + 绝对定位元素的实际占用宽度

 定位参照对象的高度 = top + bottom + margin-top + margin-bottom + 绝对定位元素的实际占用高度

◼ 如果希望绝对定位元素的宽高和定位参照对象一样，可以给绝对定位元素设置以下属性

 left: 0、right: 0、top: 0、bottom: 0、margin:0

◼ 如果希望绝对定位元素在定位参照对象中居中显示，可以给绝对定位元素设置以下属性

 left: 0、right: 0、top: 0、bottom: 0、margin: auto

 另外，还得设置具体的宽高值（宽高小于定位参照对象的宽高）

auto到底是什么?

◼ 800 = 200 + ml0 + mr0 + 0 + 0

◼ auto -> 交给浏览器你来出来

◼ width: auto;

◼ 1.行内非替换元素 -> width: 包裹内容

◼ 2.块级元素 ->width: 包含块的宽度

◼ 3.绝对定位元素 -> width: 包裹内容