ブラウザスタイルの初期化

世の中には多種多様なブラウザが存在しますが、それぞれのブラウザごとに、デフォルトのスタイルが異なる場合があります。特に、CSSでデザインしていく上で、この異なるスタイルのせいで困ってしまうことがあります。代表的なものとしては、body要素が持つデフォルトの余白を、FireFoxやIEはmargin属性で再現しているのに対し、Operaはpadding属性で再現しているという点などが挙げられます。

そこで、あらかじめ全ての要素に対してデフォルトのスタイルを指定しておくことにより、これらの違いを平坦化することが出来ます。

CSS

このようにユニバーサルセレクタを使い、CSSの一番はじめに記述することで、各ブラウザのデフォルトスタイルの違いを気にすることなく、コーディングを行うことが出来ます。

ただし、ユニバーサルセレクタを用いた指定は、多少なりとも処理に負荷がかかるため、よく使う要素にのみデフォルトスタイルを指定した方がよいと思われます。そこで、弊社で使用しているデフォルトスタイルをご紹介します。

クロノドライブで使用しているデフォルトスタイル

ぜひ参考にしてみてください。