定位属性
position属性
- 1. static：没有特别的设定，遵循基本的定位规定，不能通过z-index进行层次分级
- 2. relative：不脱离文档流，参考自身静态位置，通过top，bottom，left，right定位，可以通过z-index进行层次分级
- 3. absolute：脱离文档流，参考自身静态位置，通过top，bottom，left，right定位，可以通过z-index进行层次分级
- 4. fixed：固定定位，这里他所固定的对象是可视窗口而并非是父级元素，可以通过z-index进行层次分级
文档流：指的是元素按照其在HTML中的位置顺序决定排布的过程主要的形式是自上而下（块级元素）,一行接一行,每一行从左至右（行内元素）。
文档流=行级元素+行内元素正常排列构成的页面
z-index层叠分级
- 1. auto：遵从其父对象的定位
- 2. number：无单位的整数值，可以为负数。z-index使用证书表示元素的前后位置，数值越大，就会显示在相对靠前的位置
注： z-index只能出现在出现在定位属性出现之后；当position的值不为static值时
关于position定位的7种情况：
1） 当父元素为static时，当子元素为absolute时，子元素脱离文档流，参考body原点进行定位
2） 当父元素为static时，当子元素为relative时，子元素不会脱离文档流，参考自身位置进行定位
3） 当父元素为relative时，当子元素为absolute时，子元素脱离文档流，参考父级元素进行定位
4） 当父元素为relative时，当子元素为relative时，子元素不会脱离文档流，参考自身位置进行定位
5） 当父元素为absolute时，当子元素为absolute时，子元素脱离文档流，参考父级元素进行定位
6） 当父元素为absolute时，当子元素为relative时，子元素不会脱离文档流，参考自身进行定位
7） 当子元素为fixed时，脱离文档流，参考body原点进行定位