CSS中的position
HTML中的三种布局方式
浮动 标准流 定位
position属性的意义
position属性决定了元素将如何定位
通过top、right、bottom、left实现位置的改变
position中的可选参数 relative static absolute fixed inherit
relative 参数特性
不脱离文档流
可以利用top right bottom left 进行定位
为子定位划分作用域
移动区域为整个网页
absolute 参数特性
可以利用top right bottom left 进行定位
脱离文档流
为子定位划分作用域
移动区域为整个网页
fixed 参数特性
可以利用top right bottom left 进行定位
脱离文档流
为子定位划分作用域
移动区域为整个窗口区
定位中的层级
通过顺序插入，越后添加的定位元素层级越大
z-index改变层级
不同父元素中的子元素的层级各不相干
z-index属性值
z-index：auto(默认值)
z-index：inherit（继承）
z-index：number（number指具体数值）
z-index特性
可以设置元素的叠加顺序，但依赖定位属性
z-index大的元素会覆盖z-index小的元素
z-index为auto的元素不参与层级比较
z-index 为负值，元素被普通流中的元素覆盖
定位与边距的异同
margin、padding通过控制边距改变距离
position通过定位改变距离
作者：栗子daisy
链接：https://www.jianshu.com/p/d3c0e3517762