Flex的核心是容器和軸，容器指父級容器和子容器，軸指主軸和交軸。
容器：
- 父級容器可以統一設置子容器的排列方式，
- 子容器可以單獨設置自己的排列方式，
- 如果兩者都設置了，以子容器爲準
父容器：
justify-content：設置子容器沿着主軸排列
位置排列：
flex-start 起始端對齊
flex-end 末端對齊
center 居中對齊
分佈排列：
space-between 首尾端到父級容邊距是子容器之間邊距的一半
space-around 首尾端均勻對齊分步
align-items：設置子容器如何沿着交叉軸方向分配子容器的間距
位置排列：
flex-start 起始端對齊
flex-end 末端對齊
center 居中對齊
基線排列：
baseline 所有子容器向基線對齊，交叉軸起點到元素基線距離最大的子容器將會與交叉軸起始端相切以確定基線
拉伸排列：
stretch 子容器沿交叉軸方向的尺寸拉伸至與父容器一致
子容器：
flex：主軸上如何伸縮，flex 的值可以是無單位數字（如：1, 2, 3），也可以是有單位數字（如：15px，30px，60px），還可以是 none 關鍵字。子容器會按照 flex 定義的尺寸比例自動伸縮，如果取值爲 none 則不伸縮
三個值連用：flex-grow flex-shink flex-basis
align-items：設置子容器如何沿着交叉軸方向分配子容器的間距
位置排列：
flex-start 起始端對齊
flex-end 末端對齊
center 居中對齊
基線排列：
baseline 所有子容器向基線對齊，交叉軸起點到元素基線距離最大的子容器將會與交叉軸起始端相切以確定基線
拉伸排列：
stretch 子容器沿交叉軸方向的尺寸拉伸至與父容器一致
軸篇：https://blog.csdn.net/Gbing1228/article/details/102327316