flex 布局导致子项高度相同，如何解决

原因：Flex 布局的默认设置为：

    把所有子项变成水平排列。
默认不自动换行。
让子项与其内容等宽，并把所有子项的高度变为最高子项的高度。

解决方法：

直接在flex容器上，将align-items设为 flex-start,或者align-items属性的其他值都可以,子项就会保持其自身的高度了。

如果是使用了flex-wrap，则应该使用align-content，而不是align-items