📖 解説を見る

📐 ボックスモデルって何なに？

HTMLの要素ようそはすべて「箱はこ（ボックス）」として考かんがえます。

✏️ 主おもなCSSプロパティ：
div {
  width: 200px;　幅はば
  height: 100px;　高たかさ
  padding: 16px;　内側うちがわの余白よはく
  margin: 10px;　外側そとがわの余白よはく
  border: 2px solid red;　枠線わくせん
}

⚠️ ポイント：
・div は目めに見みえない箱はこタグ
・padding が内側うちがわ、margin が外側そとがわ

ヒントを見る

style.css に div { background-color: lightblue; border: 2px solid blue; padding: 20px; } と書こう！