CSSでデザインしていく際に、ブラウザによりデフォルトのスタイルが異なる為困ることがあります。
有名なものではbody要素が持つデフォルトの余白を、FireFoxやIEはmargin属性で再現しているのに対して、Operaはpadding属性で再現しています。
その他にの要素もブラウザ特有のスタイルがデフォルトで指定されているものがあります。
そこで、あらかじめすべての要素に対して特定のスタイルを指定することにより、ブラウザのデフォルトのスタイルの違いを吸収できます。
よく使われるのは以下のようなスタイルの初期化
* {
margin: 0;
padding: 0;
font-style: normal;
font-weight: normal;
font-size : 100%;
}これは*(ユニバーサルセレクタ)を使い、すべての要素に対して初期化を行っております。
font-styleやfont-weight、font-sizeの初期化を行うかどうかは好みの分かれるところですが
- 太字にする為strong要素を使う
- 大きい文字を書くためにh要素を使う
- 打ち消し線を入れたいからdel要素を使う
などのついやってしまう、視覚表現の為HTMLを使ってしまう、という行為を抑制する為にも個人的にはお勧めです。
これを使うと作業効率が全然変わってきますよ
