核心概念：
1.flex-direction,分main轴，以及相对main轴的纵轴(cross axes)
2.剩余可用空间：
2.1 这个与flex-grow、flex-shrink、flex-basis有关。实际情况三个属性一起使用，并通过简写表示，或者是通过预定的关键词。它们都是根据比例来实现。
2.2 还可以通过两个关键属性align-items（纵轴方向上的）和justify-content（main轴方向上的）控制item之间剩余可用空间的大小来对齐它们。
3.默认情况下，flex item只会一排或者一列排列(根据flex-direction控制)，通过flex-wrap属性来改变这样的特性，属性值为wrap时，并且在所有的item的总长度大于flex container时会出现换行的现象.
引用MDN
原文：https://www.cnblogs.com/re-doc/p/14113442.html