[`yahoo` not found]
Delicious にシェア
Digg にシェア
[`evernote` not found]
LINEで送る
Pocket

 

リセットとは?

IEやGoogle Chromeなどブラウザには、CSSを設定しなくとも、あらかじめ、デフォルトのスタイルが用意されている。

  • このデフォルトのスタイルは、ブラウザ間によって異なっている。
  • CSSファイルを制作する際、このデフォルトのスタイルが、邪魔になる場合がある。

それらを避け、ブラウザ間での見え方を統一するために、デフォルトのスタイルを無効にすることを、「CSSをリセットする。」という。

よく利用されているリセットCSS

リンク先にコードが表示されていたり、ダウンロードできるようになっています。

CSS Reset

http://cssreset.com/

 

CSS Reset | 2015’s most common CSS Resets to copy/paste, with documentation / tutorials

現時点でのリセットCSSの人気度が、一覧にされています。

Eric Meyer’s Reset CSS

http://cssreset.com/scripts/eric-meyer-reset-css/

 

Eric Meyer’s “Reset CSS” 2.0 | CSS Reset

世界中で最も利用されているリセットCSSの1つ。

特に理由がなければ、こちらを利用するか、カスタマイズする。

カスタマイズしやすいのも、特徴。

HTML5 Doctor Reset CSS

http://html5doctor.com/html-5-reset-stylesheet/

 

HTML5 Reset Stylesheet | HTML5 Doctor

HTML5対応のリセットCSS。

基本的に、Eric Meyer’s Reset CSS と似ているが、よりHTML5に特化した内容となっている。

YUI3 Reset CSS

http://yuilibrary.com/

 

YUI Library

全ての要素のデフォルト設定を、ほぼ削除するように設定されているため、全てのスタイルを完全に、制作者側でコントロールしたい場合に向いている。

Reset CSS ( meyerweb.com )

CSS Tools: Reset CSS

 

CSS Tools: Reset CSS

Normalize.css

Normalize.css: Make browsers render all elements more consistently.

 

Normalize.css: Make browsers render all elements more consistently.

Normalize.css は、他と違い、ブラウザの有用なデフォルトのスタイルを、そのまま利用できるように設計されている。

ユニバーサルセレクタ(*)によるリセット

ユニバーサルセレクタ(*)で、全ての要素でリセットを掛ける手法。

現在、あまり使われていない要因

  • 表示パフォーマンスが悪い。
  • 一部フォームの表示などで不具合が生じる。

【参考記事】

リセットCSSの基礎知識とおすすめ5選

オススメ書籍

 

 

[`yahoo` not found]
Delicious にシェア
Digg にシェア
[`evernote` not found]
LINEで送る
Pocket

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

%d人のブロガーが「いいね」をつけました。