,如Safari, 需要加前缀*/
div {
display: -webkit-flex; /*Safari*/
display: lfex;
}
一旦设置为Flex容器, 则容器内子元素的...align-content属性只适用于多行的flex容器,并且当交叉轴上有多余空间使flex容器内的flex线对齐
align-items属性适用于所有的flex容器,它是用来设置每个flex元素在交叉轴上的默认对齐方式...(N: 项目数量)
flex-grow: 2如果某个项目为2, 其它项目为1, 则它占据空间比其它项目多一倍
flex从剩余空间中分配项目所占的份数
前提是项目不要设置固定宽度, 由盒子在剩余空间中自动分配...每个盒子所在比例可以各不相同, 属性值必须是数值,整数小数都可以
如果盒子中存在有宽度的项目, 那么剩余空间应该减去它们
3. flex-shrink
设置了项目的缩小比例,默认为1, 即空间不足时,...自动等比例缩小填充主轴剩余空间
flex-shrink: 如果有一个项目为0, 其它项目为1, 则空间不足时, 它并不随其它项目缩小
注意: 该属性不支持负值, 即flex-shrink: -1 无效