【CSS】リセットCSSについて2017/04/19

ブラウザにはデフォルトのCSSがあります。

それは例えば、h1タグで書かれたテキストが大きく表示されたり、aタグのリンクに下線が入るといったことです。

それらのデフォルトのCSSのままでは、デザイン上困る場面もあります。

そのため、CSSを記述していく前にリセットCSSを用い、デフォルトのCSSによる表示をまっさらにしてからCSSを記述していくのがおすすめです。

今回は、リセットCSSを紹介してくださっているサイトを交えて書いていきたいと思います。

 

■リセットCSSをダウンロードして利用する

リセットCSSはダウンロードして利用することもできます。

人気のリセットCSSは「2016年で最もダウンロードされたリセットCSSランキングトップ5」という記事など、ネット上で多く紹介されています。

利用上の注意点としては、ライセンスが記載されている場合には記載する必要があるという点です。

記載の理由は、「お借りている」という点においての利用者のモラルのお話になります。

参考サイト：リセットCSS(2016/09/27)

参考サイト：2016年で最もダウンロードされたリセットCSSランキングトップ5(2016/08/16)

参考サイト：最近のWeb制作で利用されている、リセットCSSとノーマライズCSSのまとめ(2016/08/29)

 

■リセットCSSを自作する

ごく一部だけデフォルトのCSSを利用したいなど、リセットCSSを自作したい場合もあると思います。

 

自作については「初心者向けリセットCSSを自作する手順まとめ」という記事が参考になると思いますので、そちらをご参照ください。

また、その他にもネット上で検索することで多くの記事があります。

参考サイト：初心者向けリセットCSSを自作する手順まとめ(2016/04/07)

 

■その他

その他には、追記したCSSが反応しない場合にはリセットCSSによる影響も考えられます。

ダウンロードしたリセットCSSを利用する際は頭の隅っこにでも覚えておくと解決に繋がるかもしれません。