バナー

この教材は「ギャクサン」というWeb制作学習カリキュラムの一部です。

はじめての方はこちらからご覧ください👉

更新日

#16  「display : flex」を使って横並び・中央揃えのレイアウトの基礎を身につけよう

web兄さん

【予告】本講座の最後で課題にチャレンジします!

【Before】このHTMLを→

課題の変更前

【After】flexを使ってレイアウトを変更

課題の変更後
課題の変更後

flexは最初は考え方が難しい内容ですが、最後の課題チャレンジで身につけられるようになるので頑張って取り組んでくださいね!

web兄さん
今回は「レイアウト」をコントロールするためのテクニックの基礎を身につけていきます。例えば以下のようなことをできるようになります!

デフォルトだと縦並びのものを…

横並びにしたり


高さの違う要素を…

中央で揃えたり


並んでいる要素の

順番を入れ替えたり

web兄さん
Webサイトはレイアウトの連続!基礎をしっかり押さえましょう。