伸缩盒
我们先来了解下伸缩盒是用来干嘛的
使布局更加灵活，顾名思义，使你的布局更加有弹性
伸缩盒分为父容器和伸缩项
创建3个div 给他们加上父容器并添加属性display：flex
并且设置沿x轴方向排列，y轴设置为column
这样就有了伸缩盒的属性，伸缩项的比例用flex来设置
实现x轴的排列反转
如果想要按照自己设定的排列顺序，可以在伸缩项里面设置order，属性值为数字，那么就会按照由小到大的顺序排列你的伸缩项
当你的伸缩项不足以填满你的父容器，就可以在父容器里面设置justify-content的属性来设置伸缩项在主轴的排列方式
justify-content的属性有：flex-start、flex-end、center、space-between、space-around
1 将三个伸缩项放在左边
2 将三个伸缩项放在右边
3 将三个伸缩项放在中间
4 放在左中右，靠着父元素
5 放在左中右，不靠着父元素
