flex布局（平面布局）

容器的属性

flex-direction

控制流动方向

flex-wrap

控制是否换行

justify-content

控制主轴元素的对齐方式

align-items

控制次轴元素的对齐方式

align-content

控制多行内容

CSS定位（垂直布局）

一个div的分层

1. 最底层为背景
2. 再上一层为边框
3. 再上一层为块级子元素
4. 再上一层为浮动子元素
5. 最顶层为内联子元素（可理解为文字内容）

position属性

1. relative为相对定位，元素实际所占的地方不变（可通过其他元素来确定），但在显示上可以移动位置
2. absolute为绝对定位，它的位置是相对于离它最近的不是static定位的父元素的位置，一般都是在想要绝对定位的元素的父元素上加上relative
3. fixed相对于viewport定位

只要元素为定位元素，该元素就跑到最顶层去了

z-index可控制定位元素所在的层数

特殊属性：层叠上下文

同层级元素的z-index才能相互比较

一个元素内部元素的z-index不会影响其父元素的z-index

负的z-index只有在不是层叠上下文的元素中起作用