/html-flexbox-samples

HTMLのflexbox説明動画用のソースコード

Primary LanguageHTML

html-flexbox-samples

HTMLのflexbox説明動画用のソースコード

動画はこちら↓

HTML/CSS の flexbox について詳細解説! これでどんなデザインでも自由自在!【 flexbox 入門 】 https://youtu.be/84VY9zho4_g

各要素ごとのソースコードリスト

項目 画像
コンテナのプロパティ
flex-direction
justify-content
align-items
align-content
flex-wrap
アイテムのプロパティ
order
flex-grow
flex-shrink
align-self

サンプル

項目 画像
右端にメニューとそれ以外の範囲
**とそのすぐ左
フッター
右端と左端にメニュー
項目ごとに小さくなり方が違うテーブルのような配置