flex布局中的flex-basis与flex-shrink与flex-grow

相信大家都看过flex:6这样的布局，但是不知其所以然，这里就来分析一下

1. flex-basis性默认值是auto,如果有flex-basis属性，项目设置的宽和高就会自动忽略，而根据flex-basis属性来设置大小，当然这只是对主轴方向有效，也就是只对宽和高中一个有效。。
2. flex-grow属性是和 flex-basis一起搭配使用，如果 flex-basis来布局后，仍然有剩余空间就根据 flex-grow大小来分配空间， flex-shrink和 flex-grow的默认值是0，是0的情况下就不会占用或者缩小来适应容器的改变。。
3. flex:6就是指 flex-basis为0%， flex-shrink:1 flex-grow:6的情况，三个属性一般很少分开写，大部分都是这样的书写格式flex:flex-grow flex-shrink flex-basis。。。