flex复合属性
flex布局item的基本宽度
设置了flex-basis width就不管用了 同时存在的时候，优先使用flex-basis
如果父元素的宽度太小了，item排列不下 设置的flex-basis的宽度会自动缩小，
直到占满父元素
放大item 均匀占满父元素
flex-grow: 1;
flex: flex-grow flex-shrink flex-basis
flex:1; 代表flex: 1 1 auto;
flex-grow 0代表不放大 1 就代表放大
定义项目的放大比例，默认为0，即如果存在剩余空间，也不放大。主要作用是：分配剩余空间的
多列交叉轴方向的布局
把多列的item在整体的垂直方向上设置位置 使用align-content
align-content: center;
如果是当个item控制他的垂直方向我们使用align-items
align-items: center;
flex-start 在交叉轴的起始 flex-end 在交叉轴的末尾
center 在交叉轴的中间 space-between 在交叉轴的两端
space-around 空白环绕 两个项目之间的距离大一倍
stretch 是默认值 要想设置 首先不能设置item的高度
align-content: space-between;
flex-shrink的默认值是1
flex-shrink: 2;如果设置为2 则表示按比例缩小
值越大 按比例缩的就越小
