5-4_CSS リセット & 標準化スニペット集

ブラウザ間の表示の差異をなくすために、すべてのプロジェクトで導入すべきCSSリセットと標準化のためのスニペット集です。

1. ボックスサイジングのリセット（必須）

ボックスモデルの計算を直感的にする `box-sizing: border-box;` は必須です。これにより、width/heightがpaddingやborderを含んだサイズとして計算されるようになります。

/* すべての要素に適用する */
*, *::before, *::after {
  box-sizing: border-box;
}

2. 基本的なマージン・パディングのリセット

body, h1, h2, h3, p, ul {
  margin: 0;
  padding: 0;
}

Kindle本のご案内