align-items

實(shí)例

居中對齊彈性盒的各項(xiàng) <div> 元素：

div { display: flex; align-items:center; }

表格中的數(shù)字表示支持該屬性的第一個(gè)瀏覽器的版本號(hào)。

緊跟在 -webkit-, -ms- 或 -moz- 后的數(shù)字為支持該前綴屬性的第一個(gè)版本。

屬性
align-items	21.0	11.0	20.0	9.0 7.0?-webkit-	12.1

align-items 屬性定義flex子項(xiàng)在flex容器的當(dāng)前行的側(cè)軸（縱軸）方向上的對齊方式。

提示：使用每個(gè)彈性對象元素的 align-self 屬性可重寫 align-items 屬性。

默認(rèn)值：	stretch
繼承：	否
可動(dòng)畫化：	否。請參閱可動(dòng)畫化（animatable）。
版本：	CSS3
JavaScript 語法：	object.style.alignItems="center" 運(yùn)行代碼

值	描述
stretch	默認(rèn)值。元素被拉伸以適應(yīng)容器。如果指定側(cè)軸大小的屬性值為'auto'，則其值會(huì)使項(xiàng)目的邊距盒的尺寸盡可能接近所在行的尺寸，但同時(shí)會(huì)遵照'min/max-width/height'屬性的限制。
center	元素位于容器的中心。彈性盒子元素在該行的側(cè)軸（縱軸）上居中放置。（如果該行的尺寸小于彈性盒子元素的尺寸，則會(huì)向兩個(gè)方向溢出相同的長度）。
flex-start	元素位于容器的開頭。彈性盒子元素的側(cè)軸（縱軸）起始位置的邊界緊靠住該行的側(cè)軸起始邊界。
flex-end	元素位于容器的結(jié)尾。彈性盒子元素的側(cè)軸（縱軸）起始位置的邊界緊靠住該行的側(cè)軸結(jié)束邊界。
baseline	元素位于容器的基線上。如彈性盒子元素的行內(nèi)軸與側(cè)軸為同一條，則該值與'flex-start'等效。其它情況下，該值將參與基線對齊。
initial	設(shè)置該屬性為它的默認(rèn)值。請參閱 initial。
inherit	從父元素繼承該屬性。請參閱 inherit。