フレックス方向性は、主方向を決定する（すなわち、プロジェクトの配列方向）。
フレックスラップ：行行時にラップを下回りません
正当化-content属性は、スピンドル上の項目の配置を定義します。
ALIGN-アイテムのアイテム属性は、クロスシャフトを位置合わせする方法を定義します。
ALIGN-コンテンツ属性は、軸配向の複数を定義します。プロジェクトは唯一つの軸である場合は、プロパティが動作しません。
プロジェクトのプロパティ：順序;フレックス成長;フレックス収縮;フレックス基礎を、フレックス;揃える自己
オーダー属性定義項目を注文。値が小さいほど、より前方に配置は、デフォルトは0です。
デフォルトは0である空きスペースがある場合拡大に項目属性の定義をフレックス成長、すなわち、拡大しません。
フレックスシュリンク属性は、そのスペースが不足している場合、プロジェクトが削減される、され、デフォルトは1で、プロジェクトの縮尺を定義します。
フレックス基本属性は、プロジェクト（メインサイズ）によって占有され、余分なスペースを割り当てる前に、スピンドルスペースを定義します。余分なスペースがあれば、ブラウザは、このプロパティに基づいて、スピンドルを計算します。デフォルトでは、プロジェクトの元のサイズということ、autoです。
Flexのプロパティは、成長フレックスフレックス縮小し、フレックスベーシス速記あり、デフォルト値0 1オート。2つのオプションの属性の後。
ALIGN-自己属性が他の項目との単一アイテムが異なる配向を有することができ、ALIGN-itemsプロパティをカバーすることができます。親は、ストレッチに相当しない場合、デフォルト値は、親要素のALIGN-アイテム属性の継承を示す、自動です。
サンプルコード：
<！DOCTYPE HTML>
<HTML LANG = "EN">
<HEAD>
<メタ文字コード= "UTF-8">
<タイトル>フレックステスト</ TITLE>
</ HEAD>
<スタイルタイプ= "テキスト/ cssの">
.flex {
幅：1000px。
高さ：500pxなど。
表示：フレックス。
国境：1pxの＃333固体;
フレックスフロー：行反転ラップ。
背景色：#fdfdfd。
マージン：は50px自動;
正当化-コンテンツ：スペースアラウンド。
ALIGN-アイテム：センター;
}
.flex> P {
幅：200pxの。
行の高さ：100pxに。
背景色：#eeeeee。
フォントサイズ：20ピクセル;
テキスト整列：センター;
}
.flex P：n番目の子（1）{
順序：1。
フレックス基礎：自動;
フレックス基礎：1000px;
}
.flex P：n番目の子（2）{
順序：1。
フレックス成長：1;
フレックス基礎：自動;
}
.flex P：n番目の子（3）{
順序：2。
フレックス成長：3;
}
.flex P：n番目の子（4）{
順序：2。
フレックス収縮：0;
}
.flex P：n番目の子（5）{
順序：3。
フレックス成長：0;
フレックス基礎：10pxの;
}
.flex P：n番目の子（6）{
オーダー：4。
フレックス基礎：自動;
合わせ自己：センター;
}
.flex P：n番目の子（7）{
順序：1。
フレックス収縮：0.5;
フレックス基礎：自動;
}
</スタイル>
<body>
<DIV CLASS = "フレックス">
<P>最初</ P>
<P>第二</ P>
<P> thrid </ P>
<P>第</ P>
<P >第</ P>
<P>第</ P>
<P>第</ P>
</ div>
</ body>
</ HTML>
效果图。
摘自：http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html