Flex Box
以下讨论的属性无论大小,收缩或者伸展,均是按照flex conntainer的主轴方向说的。
flex-grow: 是否允许flex item在多余空间内伸展。默认为0, 即不允许伸展。
flex-shrink: 是否允许flex item在flex container宽度收缩时自动收缩。默认为1,即允许。
flex-basis: 指定flex item的初始大小。 默认值为auto, 意味着flex item会根据内容的大小自动决定。
flex: flex grow flex-shrink flex-basis的缩写。
flex: 2 <=> flex: 2 1 0, 表示将flex item的初始宽度设置为0,然后伸展项目以填满可用空间,并且在某些情况下也可以收缩flex item。