flex速记

1. flex容器属性6个

flex-direction: 主轴方向
flex-wrap: 换行方式
flex-flow: <flex-direction> <flex-wrap> 简写
justfiy-content: 主轴对齐方式
align-items: 纵轴对齐方式
align-content: 多主轴时候，纵轴对齐方式

2. flex项目属性6个

order： 项目的排列顺序
flex-grow：项目的放大比例
flex-shrink：项目的缩小比例
flex-basis：项目占据的主轴空间（main size）
flex：flex-grow | flex-shrink | flex-basis
align-self：单个项目有与其他项目不一样的对齐方式

3. flex:1

flex:1 自适应剩余所有空间

flex: 1 === flex: 1 1 0%