Main Axis (主軸)

ここへジャンプ:

flexbox における主軸は、flex-direction プロパティの設定方向によって定義されます。flex-direction が取り得る値は以下の四つです。

  • row
  • row-reverse
  • column
  • column-reverse

row または row-reverse を選んだ場合は、主軸はインライン要素の並ぶ方向に伸びる軸となります。

flex-direction が row の場合の主軸

column または column-reverse を選んだ場合は、ページの上から下に向かってブロック要素の並ぶ方向に伸びる軸となります。

アイテムの flex プロパティを使って、flex アイテム自体が使える幅を指定することで、主軸に沿ったサイズを制御することが出来ます。また、アイテム間そしてアイテムの周囲の余白について、justify-content プロパティを使って制御することが出来ます。

関連項目

プロパティリファレンス

参考文献

ドキュメントのタグと貢献者

 このページの貢献者: Uemmra3, reppets
 最終更新者: Uemmra3,