JavaScript 參考手冊
表格中的數(shù)字表示支持該屬性的第一個瀏覽器的版本號。
緊跟在 -webkit-, -ms- 或 -moz- 后的數(shù)字為支持該前綴屬性的第一個版本。
屬性 | |||||
---|---|---|---|---|---|
align-self | 21.0 | 11.0 | 20.0 | 9.0 7.0?-webkit- |
12.1 |
align-self 屬性定義flex子項單獨(dú)在側(cè)軸(縱軸)方向上的對齊方式。
注意:align-self 屬性可重寫靈活容器的 align-items 屬性。
默認(rèn)值: | auto |
---|---|
繼承: | 否 |
可動畫化: | 否。請參閱 可動畫化(animatable)。 |
版本: | CSS3 |
JavaScript 語法: | object.style.alignSelf="center" 運(yùn)行代碼 |
值 | 描述 | 測試 |
---|---|---|
auto | 默認(rèn)值。元素繼承了它的父容器的 align-items 屬性。如果沒有父容器則為 "stretch"。 | 測試 ? |
stretch | 元素被拉伸以適應(yīng)容器。 如果指定側(cè)軸大小的屬性值為'auto',則其值會使項目的邊距盒的尺寸盡可能接近所在行的尺寸,但同時會遵照'min/max-width/height'屬性的限制。 |
測試 ? |
center | 元素位于容器的中心。 彈性盒子元素在該行的側(cè)軸(縱軸)上居中放置。(如果該行的尺寸小于彈性盒子元素的尺寸,則會向兩個方向溢出相同的長度)。 |
測試 ? |
flex-start | 元素位于容器的開頭。 彈性盒子元素的側(cè)軸(縱軸)起始位置的邊界緊靠住該行的側(cè)軸起始邊界。 |
測試 ? |
flex-end | 元素位于容器的結(jié)尾。 彈性盒子元素的側(cè)軸(縱軸)起始位置的邊界緊靠住該行的側(cè)軸結(jié)束邊界。 |
測試 ? |
baseline | 元素位于容器的基線上。 如彈性盒子元素的行內(nèi)軸與側(cè)軸為同一條,則該值與'flex-start'等效。其它情況下,該值將參與基線對齊。 |
測試 ? |
initial | 設(shè)置該屬性為它的默認(rèn)值。請參閱 initial。 | 測試 ? |
inherit | 從父元素繼承該屬性。請參閱 inherit。 |
CSS 參考手冊:align-content 屬性
CSS 參考手冊:align-items 屬性
其他擴(kuò)展