flex-shirnk 与 flex-grow

        1.shrink

                shrink就是告诉子元素当父元素宽度不够用时,自己调整自己所占的宽度比
                flex-shrink：1时,表示所有子元素大家同时缩小来适应总宽度。

                flex-shrink：0时,表示大家都不缩小适应。

                给父元素设置了flex布局后,若要其子元素的width有效果,必须给子元素设置

                flex-shrink: 0;防止元素变形

        2.grow

                flex-grow: 0表示正常状态，不放大；取消flex盒子会超过父级div时会自动收缩。

                给父级设置overflow溢出设置，适用于单行（不想收缩，又想在一行显示）

                flex-grow: 1表示一旦发生变化，弹性子元素的宽度也会做出相应的调整。

                可以完美的填充父级的盒子，跟随屏幕的缩放自动调整