🎯 このDayを終えるとできること
セレクタ・ボックスモデル・Flexbox・レスポンシブの考え方を理解し、AI生成CSSの意図を読めるようになる。
CSSの基本 — どの要素を、どう見せるか
セレクタは宛名、プロパティは指示。CSSは「誰に」「何をする」を書く手紙だと考える。
設問 3 問
ボックスモデル — すべての要素は箱
画面上の要素はすべて四角い箱。margin/border/paddingで、箱の余白と枠を調整する。
並べる — Flexboxの考え方
箱をきれいに横一列や縦に並べる仕組みがFlexbox。棚に物を並べるイメージで意図を読む。
レスポンシブ — 画面幅で変わるレイアウト
同じHTMLでもスマホとPCで見え方を変える。伸び縮みするレイアウトの考え方を学ぶ。