MENU
オンライン講座開催中
html&css講座開催中

リセットCSSとユーザーエージェントとは?

リセットCSSとユーザーエージェントとは?
目次

リセットCSSとは

各ブラウザに付属しているデフォルトのスタイルを打ち消すリセットCSS。

リセットCSSとはブラウザによるスタイルの差異をなくすことが目的。

にゃんこ2

リセットCSSとはブラウザによるスタイルの差異をなくすことが目的にゃ。

ユーザーエージェントととは?

各ブラウザごとの付属しているデフォルトのスタイルをユーザーエージェントという。

各ブラウザのユーザーエージェント

にゃんこ1

各ブラウザごとのスタイルシートは公開されているので一度確認してみてにゃ。

リセットCSSを使うメリット

  • ブラウザごとの差異がなくなる
  • ブラウザごとのCSSを書かなくて済む

リセットCSSの種類

大まかに分けてこの4種類がある。

  1. IEをサポート。
  2. ユーザエージェント別スタイル統一(リセット)。
  3. ユーザエージェントのエラー修正(ノーマライズ)。
  4. 独自のスタイルを作成。
にゃんこ2

特にリセット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を使用しよう。

にゃんこ1

最近リセットCSSを定期的に確認にゃ。

詳しいリセットCSSのテンプレはコチラのページを確認してね▼

詳しくは講座に来てね

リセットCSSとユーザーエージェントとは?

この記事が気に入ったら
フォローしてね!

  • URLをコピーしました!
目次
閉じる