[Angular8]サイトを簡単スタイリング！Angular Flex-Layoutの使い方をまとめてみた | DevelopersIOどうも！大阪オフィスの西村祐二です。 フッター、ヘッターのレイアウトなど、画面のスタイリングをする際に、CSSのFlexboxなどで記載していく人は多いのではないでしょうか。 AngularではCSSのFlexboxをCSSファイルに書かず、HTMLタグ(ディレクティブ)を設定するだけで、簡単にFlexboxを設定できるライブラリAngular Flex-Layoutが公式から提供されています。 ex) <div fxLayout="row" fxLayoutAlign="space-between"> </div> 今回はそのAngular Flex-Layoutの使い方をまとめてみます。 目次 環境 試していく環境を準備 早速試していく！ fxLayout 子要素の並ぶ向き fxLayoutAlign 要素の整列順 fxLayoutGap 要素間のマージン設定 Grid Mode fx
![[Angular8]サイトを簡単スタイリング！Angular Flex-Layoutの使い方をまとめてみた | DevelopersIO](https://cdn-ak-scissors.b.st-hatena.com/image/square/07aa11b12376196229f0af49b9b58f3d8d0f1b87/height=288;version=1;width=512/https%3A%2F%2Fdevio2023-media.developers.io%2Fwp-content%2Fuploads%2F2019%2F06%2FAngular8.png)
