Flex Terms
弹性容器
Flex Container
弹性容器
元素与轴
容器属性值
在文档流中的直接子元素才是在弹性元素
弹性元素
弹性布局
布局属性
方向flex-direction
方向
方向案例
换行flex-wrap
flex-wrap
换行样例
一次性设置两个属性（flex-direction/flex-wrap）
image.png
order顺序
默认情况order都是0，可以设置为负值，这是一个相对值，越小越在前。
order
弹性
弹性相关属性
flex-basis
flex-grow
弹性相关属性
flex-basis
main-size | <width>
main-size指的是主轴上的距离，可能是高度也可能是宽度
设置flex item的初始宽高
flex-grow
number 初始值为0
flex-grow
flex-grow样例
flex-shrink
number 初始值为1
flex-shrink
flex-shrink样例
flex
flex
flex样例
对齐
对齐相关属性
对齐相关属性
justify-content
与text-align类似但是更加强大
flex-start | flex-end | center | space-between | space-around
flex-start前对齐
flex-end后对齐
center 居中对齐
space-between 平分空白空间
space-around 平分空白空间【包括首尾】
justify-content
justify-content样例
align-items
设置辅轴上的对齐方式
类似于vertical-align，但是更强大
align-items
align-items样例
align-self
设置单个flex item在辅轴上的对齐方式
和align-items类似，只不过align-items是在容器上设置的
align-self
align-self样例
align-content
align-content
对于容器的元素出现了多行，并在容器中有剩余空间，就通过align-content设置
align-content
align-content样例
