flex: 1 怎么理解

1.flex 是一个复合属性，它是3个属性的简写 flex-grow flex-shrink flex-basis
2.flex:1 相当于flex-grow: 1; flex-shrink: 1; flex-basis: 0%;

flex-grow 是分配外层盒子剩余空间
flex-shrink 是内部的内容大于外层盒子时，给内部盒子设置这个属性，来约定盒子按什么比例来缩放盒子
flex-basis：0% 设置盒子的基准宽度，并且basis和width同时存在会把width干掉