例
柔軟性のあるアイテムがnecesarry場合ラップしてください：
div {
display: -webkit-flex; /* Safari */
-webkit-flex-wrap: wrap; /* Safari 6.1+ */
display: flex;
flex-wrap: wrap;
} »それを自分で試してみてください 定義と使用法
フレックスラッププロパティは、柔軟なアイテムがラップすべきか否かを指定します。
Note:要素は柔軟性の項目でない場合は、フレックスラッププロパティは効果がありません。
| デフォルト値： | nowrap |
|---|---|
| 継承されました： | no |
| アニメーション： | no. Read about animatable |
| バージョン： | CSS3 |
| JavaScriptシンタックス： | object .style.flexWrap="nowrap" Try it |
ブラウザのサポート
表中の数字は完全にプロパティをサポートする最初のブラウザのバージョンを指定します。
数字は-webkit-に続くかの接頭辞で働いていた最初のバージョンを指定します-moz-。
| プロパティ | |||||
|---|---|---|---|---|---|
| flex-wrap | 29.0 21.0 -webkit- | 11.0 | 28.0 18.0 -moz- | 9.0 6.1 -webkit- | 17.0 |
CSSの構文
flex-wrap: nowrap|wrap|wrap-reverse|initial|inherit;プロパティ値
| 値 | 説明 | それを再生します |
|---|---|---|
| nowrap | デフォルト値。 柔軟性のあるアイテムが折り返さないように指定します | それを再生します» |
| wrap | 必要に応じて柔軟なアイテムがラップすることを指定します | それを再生します» |
| wrap-reverse | 必要に応じて柔軟なアイテムは逆の順番で、ラップするように指定します | それを再生します» |
| initial | このプロパティがデフォルト値に設定します。 初期についての記事を読みます | それを再生します» |
| inherit | その親要素からこのプロパティを継承します。 継承についての記事を読みます |
関連ページ
CSSリファレンス： flex property
CSSリファレンス： flex-flow property
CSSリファレンス： flex-direction property
CSSリファレンス： flex-basis property
CSSリファレンス： flex-grow property
CSSリファレンス： flex-shrink property
HTML DOMリファレンス： flexWrap property