Style flex属性
- 前のページ filter
- 次のページ flexBasis
- 上一層に戻る HTML DOM Styleオブジェクト
定義と使用方法
flex 属性は、同じコンテナ内の他のエラストイックアイテムに対してアイテムの長さを設定または返します。
flex 属性はflexGrow、flexShrink、flexBasis属性のショートカット属性です。
注記：要素がエラストイックアイテムでない場合、 flex 属性が無効です。
また参照してください：
CSSリファレンスマニュアル：flex属性
HTML DOM STYLEリファレンスマニュアル：flexBasis属性
HTML DOM STYLEリファレンスマニュアル：flexDirection属性
HTML DOM STYLEリファレンスマニュアル：flexFlow属性
HTML DOM STYLEリファレンスマニュアル：flexGrow属性
HTML DOM STYLEリファレンスマニュアル：flexShrink属性
HTML DOM STYLEリファレンスマニュアル：flexWrap属性
例
コンテンツに関係なくすべてのエラストイックアイテムの長さを同じにします：
for (i = 0; i < y.length; i++) {
y[i].style.flex = "1";
}
文法
flex属性を返します：
object.style.flex
flex属性を設定します：
object.style.flex = "flex-grow flex-shrink flex-basis|auto|initial|inherit"
属性値
| 値 | 説明 |
|---|---|
| flex-grow | 数値、アイテムが他のエラストイックアイテムに対して拡大される量を指定します。 |
| flex-shrink | 数値、アイテムが他のエラストイックアイテムに対して縮小される量を指定します。 |
| flex-basis |
アイテムの長さ。 合法値：「auto」、「inherit」、または「%」、「px」、「em」などの単位を持つ値、または他の長さ単位。 |
| auto | 1 1 autoに等しい。 |
| initial | 0 1 autoに等しい。initialを参照。 |
| none | 0 0 autoに等しい。 |
| inherit | 親要素からこの属性を継承します。参照してください inherit。 |
技術的詳細
| デフォルト値： | 0 1 auto |
|---|---|
| 返り値： | 文字列、要素の flex属性。 |
| CSSバージョン： | CSS3 |
ブラウザのサポート
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| サポート | 11.0 | サポート | 9.0 | サポート |
- 前のページ filter
- 次のページ flexBasis
- 上一層に戻る HTML DOM Styleオブジェクト
