Flex：1就是flex-grow、flex-shrink、flex-basis三个属性的缩写，对应的值就是 1 1 0。是来用实现自适应空间的。
具体来讲就是：
flex-grow用来决定对剩余空间的占用量，如果没有剩余空间，这个属性就不起作用。默认值是0，就是不会填充多余空间。如果是正数，就按照 有多少的正数 按系数比例来划分剩余空间。不可以是负值。
同理，flex-shrink是在flex元素默认宽度之和大于容器的时候才会发生收缩，比如剩下的宽度放不下div盒子，可以采取换行或者压缩，Flex布局默认不换行。
flex-shrink的默认值是 1，数值越大，压缩得越厉害，计算规则就是系数×宽度的总占比来分配减少的空间，负值同样不允许。0就是不缩小。
比如：
假有一个父元素 400px，子元素A为 200px，子元素B为 300px.则超出空间为 100px
A设置 flex-shirk 为 3，B设置 flex-shirk 为 2。则最终 A 的大小为 自身宽度 (200px) - A减小的宽度(100px * (200px * 3 / (200px * 3 + 300px * 2))) = 150px A自身宽度 -
最终 B 的大小为 自身宽度 (300px)- B减小的宽度 (100px * (300px * 2/(200px* 3 + 300px* 2))) = 250px
flex-basis就是就是 flex 元素在主轴方向上的初始大小，默认值是auto，就是根据元素的内容调整，也可以指定具体是多少px，如果设置为0，一般就是width的大小，压缩到最小的程度。flex-basis的优先级比width高。
