CSSのすべての要素は、内側から外側へ4つのレイヤーで構成される矩形のボックスです:content、padding、border、marginです。それらがどのように組み合わさるかを理解することが、すべてのレイアウトの基礎になります。
text
┌─────────────── margin ───────────────┐ ← space OUTSIDE, between elements
│ ┌──────────── border ────────────┐ │
│ │ ┌───────── padding ────────┐ │ │ ← space INSIDE, around content
│ │ │ content │ │ │ ← text/image (width × height)
│ │ └──────────────────────────┘ │ │
│ └─────────────────────────────────┘ │
└────────────────────────────────────────┘
css
{
: ;
: ;
: solid;
: ;
}
