Sponsored Link
プロパティ・値の解説
| プロパティ | 指定の効果 | 値 |
|---|---|---|
| display | 指定要素の内側と外側の表示種別の指定 | block・inline・inline-block・ flex・inline-flex・grid・ inline-grid・flow-rootなど |
display: flex; = 子要素のレイアウトをフレキシブル(可変・柔軟)に指定 ※超重要
「display」は非常に奥が深いプロパティであり、この「display」を理解することがコーディングスキル向上のポイントになります。
中でも「display: block;」「display: inline;」「display: flex;」に関しては使用頻度・重要度がともに高いです。
以後「display: flex;」を指定したボックスを「フレックスボックス」と呼称します。
特に「display: flex;」はcssにおいて理解するまでが難しいもの一つですが、理解しさえすればWebサイトのレイアウトは自由自在です。
とても重要であり、使いこなせばレイアウトが自在になるため、以下の記事でまとめています。