Webページのデフォルトの余白をCSSで修正する

HTMLを用いてWebページを作成した際、デフォルトでは画面の端に少し余白があります。

例えばヘッダーを作ってみるとこんな感じ。

ページのソースを見てみると、body要素に8pxのマージンが設定されているのがわかります。

ということで、CSSを用いてbodyのmarginを0にします。


body {
  margin: 0;
}

そうすると画像のように余白がなくなり、画面いっぱいにヘッダーが表示されるようになりました。

コメント