フレックスの用途を総合的に理解する

<スパン I. フレックスを使って、divを別のdivの中で水平方向と垂直方向に中央化することができます

例えば、htmlのコードです。　

<div class="container">
	<div class="box">

	</div>
	</div>

のCSSコードです。

.container{
	width:600px;
	height:400px;
	border:1px solid blue;
	display: flex;
	justify-content:center;
	align-items:center;
	}
	.box{
	width:200px;
	height:100px;
	border:1px red solid;

ps:水平・垂直方向にセンタリングできるよう

II. フレックスの特性

<div class="items">
	<div class="item">1</div>
	<div class="item">23</div>
	<div class="item">4</div>
	</div>

アイテムに書き込むことができる属性は6つあります。

-フレックスディレクション
-フレックスラップ
-フレックスフロー
-コンテンツの正当化
-アイテムの整列
-コンテンツの整列

アイテムに書き込めるのは6つです。

-order// これはアイテムに個別に与えられるもので、そのアイテムの順序を変更したい場合は、この属性をそのアイテムに与えます。
-フレックスグロウ
-フレックスシュリンク
-フレックスベース
-flex
-アラインセルフ

以上、フレックスの用途を総合的に理解した上で、スクリプトハウスを応援していただければと思います。