Flex的核心是容器和軸，容器指父級容器和子容器，軸指主軸和交軸。
軸：
主軸：justify-content；flex-direction 決定主軸的方向
flex-direction: row 向右
flex-direction: column 向下
flex-direction: row-reverse 向左
flex-direction: column-reverse 向上
交叉軸：align-items；
Flex進階概念
父容器：
flex-wrap 設置換行方式
nowrap：不換行
wrap：換行
wrap-reverse：逆序換行
flex-flow 軸向與換行組合設置
flow 即流向，也就是子容器沿着哪個方向流動，流動到終點是否允許換行，比如 flex-flow: row wrap
align-content 多行沿交叉軸對齊
當子容器多行排列時，設置行與行之間的對齊方式。
位置排列：
flex-start 起始端對齊
flex-end 末端對齊
center 居中對齊
分佈排列：
space-between 首尾端到父級容邊距是子容器之間邊距的一半
space-around 首尾端均勻對齊分步
拉伸排列：
stretch 子容器沿交叉軸方向的尺寸拉伸至與父容器一致
子容器：
flex-basis 設置基準大小
flex-grow 設置擴展比例
flex-shrink 設置收縮比例
order 設置排列順序