兼容容器M炊狻B铡4Х恰D志俊匿沛!
justify-content: 項(xiàng)目在主軸上的排列方式
flex-start(默認(rèn)值) 居左 | flex-end 居右 | center居中 | space-between兩端對齊?
?space-around 每個項(xiàng)目兩側(cè)的間隔相等 | space-evenly分散對齊(每個間隔都相等)
flex-direction: 主軸方向
row(默認(rèn)值) 水平從左至右 ?| ?row-reverse 水平從右到左 ?| ? column ?垂直從上到下 ?| ?column-rever ?垂直從下到上
flex-wrap: ?是否允許項(xiàng)目換行
nowrap(默認(rèn)值) 不允許換行 | ? wrap 可以換行夹姥,第一行在上方 | ?wrap-reverse 可以換行蔑穴,第一行在下方
align-items: 項(xiàng)目在交叉軸上的對齊方式
?flex-start 項(xiàng)目在交叉軸起點(diǎn) ? | ?flex-end 項(xiàng)目在交叉軸終點(diǎn) ?| ?center 交叉軸居中 ?| baseline 第一行文字的基線對齊 ?| ?stretch(默認(rèn)值) 項(xiàng)目沒有設(shè)置高度陷谱,項(xiàng)目會沾滿交叉軸
align-content: 只在存在多根主軸的時候有效这嚣,定義的是主軸在交叉軸上的分布方式
flex-start 交叉軸起點(diǎn) | flex-end 交叉軸終點(diǎn) | center 交叉軸的中間 | space-between 交叉軸兩端 | space-around | 每根主軸兩側(cè)的間隔相等鸥昏,分布 | space-evenly 分散對齊 | stretch 沾滿交叉軸 默認(rèn)值
兼容項(xiàng)目!=阒恪吏垮!
order: 項(xiàng)目的排列順序,默認(rèn)值都為0罐旗,值越小膳汪,越靠前
flex-grow: 是否允許項(xiàng)目放大
,默認(rèn)值是0代表不允許放大;可取值是數(shù)值,如果取值為1或者大于1的數(shù)值九秀,代表可以放大
flex-shrink: 是否允許項(xiàng)目縮小
默認(rèn)值是1代表允許縮小
flex-basis: 項(xiàng)目占主軸空間
默認(rèn)值是auto
flex: ?flex-grow flex-shrink flex-basis的簡寫
,默認(rèn)值是0 1 auto 不允許放大遗嗽,可以縮小,主軸空間自適應(yīng)
有兩個快捷值: auto(1 1 auto)和none(0 0 auto) ,也可以單獨(dú)設(shè)置三個值