50代からのHTML / CSS / Java Script 　チャレンジNo.15 サニタイズとリセットの違い

こんばんは〜昨日は、sanitize.cssをダウンロードして、HTMLファイルで読み込むっていう学習をしました。復習として、sanitizeはブラウザーによる行間とかデフォの設定を無視してくれるcssだと認識しました。似たような機能にリセットというのがあるので、その違いを今日は学習します。

reset.css

今回は見てるだけなんですが、reset.cssには種類があるらしい。今回は、destyle.cssっていうのをGoogleで検索してそれを活用するんだけど、

下にダウンロードボタンがある。

ほんと何もかもリセットされるようです。既存のスタイルは全部破棄する感じですね。（こんなの昔はなかったと思うんだけどなぁ・・・）で、今回はダウンロードはしなくてもっと簡単な方法で使うらしい。ダウンロードボタンの上にある。CDNをクリック。別サイトに飛ぶ。

右側にあるunpkgの右側のリンクをクリック。リンク先に飛ぶ。

でこの中の、destyle.min.cssをクリック。

View Rawをクリックして、アドレスをコピーする。そしたら、そのアドレスをsanitize.cssのところに置き換える。

そしたら、保存して、ブラウザーをリロードする。

さらに、その下のcss/style.cssをコメントアウトして、保存。ブラウザーのリロードをする。

いやぁ見出のスタイルもなくなった。＾＾；ほんとにまっさらになるのね＾＾；

sanitize.css

それに対して、sanitize.cssはブラウザーごとのクセを無視するイメージですね。タグはもつ意味は踏襲する。（reset.cssはタグの意味も破棄）たとえば、見出しは、大きい文字で、太い文字にするよっていうのは踏襲する。（reset.cssはそれも無視）

どちらがいいと言うわけではないらしい・・・作りたいウェブページによるんだって。今回はsanitizeの方がいいからそちらを使う（らしい）。

と言うわけで今日の学習は終了！！お疲れ様でした〜