リセットCSSでブラウザー間の独自の設定を打ち消しておこう
何の準備もなくホームページをコーディングしてしまうと、ブラウザーによって見え方が全く異なってしまいます。これはホームページを作るときの基本中の基本ですが、人によって使用しているリセットCSSは異なります。ときどき、自作している人もみかけますが最初から設定すると大変なので、配布されているリセットCSSを活用するのもよいかと思います。
まずは、どんなリセットCSSがあるのか見てみましょう。
何の準備もなくホームページをコーディングしてしまうと、ブラウザーによって見え方が全く異なってしまいます。これはホームページを作るときの基本中の基本ですが、人によって使用しているリセットCSSは異なります。ときどき、自作している人もみかけますが最初から設定すると大変なので、配布されているリセットCSSを活用するのもよいかと思います。
まずは、どんなリセットCSSがあるのか見てみましょう。
この記事は「2020年12月19日」に書かれた記事です
リセットCSSはブラウザが個々に設定をしているスタイルを打ち消すためのCSSです。
基準となるCSSが全ブラウザ共通であればよいのですが、
ブラウザーによって固有の設定をしています。
この固有の設定をリセットしておかないと、ブラウザによって異なる表示(見た目)となってしまいます。つまり、Google Chromeでは意図したデザインになっているけど、Internet Explorerで閲覧したら驚くほど崩れていた! ということになります。
Normalize.css
http://necolas.github.io/normalize.css/
Normalize.cssはまっさらな状態までスタイルを打ち消さないリセットCSSです。
厳密にはブラウザ間の設定をリセットした上で、シンプルなスタイルが適用されようになっています。個人的には制作を始めた頃から「Normalize.css」を利用していることもあり、今も使用しています。
そのほかにも下記の仕様があります。
HTML5 Doctor Reset CSS
http://html5doctor.com/html-5-reset-stylesheet/
上記のほかにもリセットCSSあります。
と思ったら別のものを試してみるのもよいのではないでしょうか。
HOME > ホームページ制作 > CSSでホームページを1UP > リセットCSSでブラウザー間の独自の設定を打ち消しておこう