目次
リセットCSSとは
各ブラウザに付属しているデフォルトのスタイルを打ち消すリセットCSS。
リセットCSSとはブラウザによるスタイルの差異をなくすことが目的。
にゃんこ2
リセットCSSとはブラウザによるスタイルの差異をなくすことが目的にゃ。
ユーザーエージェントととは?
各ブラウザごとの付属しているデフォルトのスタイルをユーザーエージェントという。
各ブラウザのユーザーエージェント
各ブラウザごとのスタイルシートは公開されているので一度確認してみてにゃ。
リセットCSSを使うメリット
- ブラウザごとの差異がなくなる
- ブラウザごとのCSSを書かなくて済む
リセットCSSの種類
大まかに分けてこの4種類がある。
- IEをサポート。
- ユーザエージェント別スタイル統一(リセット)。
- ユーザエージェントのエラー修正(ノーマライズ)。
- 独自のスタイルを作成。
特にリセットCSSとノーマライズCSSを使う(特にノーマライズCSSが一般的使われるにゃ。)
※ノーマライズCSSの事もリセットCSSと呼ばれる。
※私が勉強した時は、ノーマライズCSS系をリセットCSSと習い、そちらを使用していました。
リセットCSSを書く順番
HTMLのhead内の通常のCSSの上にリセットCSSを配置する
<head>
<link rel="stylesheet" href="reset.css">
<link rel="stylesheet" href="style.css">
</head>
CSSを記述していない状態表記
ちなみにCSSをかける前のスタイルも下記で確認しておこう▼
リセットCSSのテンプレート
日々進化するCSSに対応したリセットCSSを使用しよう。
最近リセットCSSを定期的に確認にゃ。
詳しいリセットCSSのテンプレはコチラのページを確認してね▼
リセットCSSとノーマライズCSSのテンプレート紹介【2022年】
環境が日々変わるので、リセットCSSは、毎年新しいものを使おうにゃ。