リセットCSSというものをご存知でしょうか?
文字通り、CSSをリセットするものです。
例えばこれ。
このように書くと、ブラウザーでは
このように表示されますね。
自分でCSSとか指定しなくても、文字が大きくなったり、太くなったりします。
これはなぜかというと、ブラウザーでh1, h2 のスタイルが決められているからなんですね。
便利な半面、作り手からするとブラウザーによって表示が変わるという不都合があります。
そこで登場するのがリセットCSSです。
こんな感じで、リセットCSSを適用する一行を追加すると、
こんな感じで、スタイルがなくなります。
便利ですよね。
よし、これでリセットされた。
今から自分でスタイル作ってくぞ!
って思ったのです。
こんな感じで、自分でCSSを書きました。
ところが。
フォントの大きさが適用されない。なぜ！( ﾟдﾟ)
答えを言ってしまうと、これ、先に書いたものの順番がだめだったのです。
リセットCSSを後に書いてしまっていたのですね。
このように、自分のCSSファイルの適用を下の行に書いてやります。
すると
ちゃんとフォントの大きさも適用されました。
CSSは後優先だと心得ること！
そう、CSSは後に記述したものが優先されるのです。
よって、最初の書き方だとリセットCSSが自分のCSSより優先されてしまう。
既存のタグについていくら書いても全然適用されなかったので困っていました。
何がつらいって、私は、
この事に気づくまで数ヶ月かかってしまいまいました( ；∀；)
全然適用されなかったので、全タグに対してクラス名を指定したりしていました。
あれ?でも、これが解決しても全タグにクラス名は指定していたほうがいいのかな?
まだまだ疑問は尽きませんね・・・。
リセットCSSを使うと既存タグのスタイルはカスタムできないのでは?
という謎の法則を考えたりもしましたね。
そりゃあんたの最初の書き方だったらそうだったでしょうよ、と昔の自分に突っ込んでやりたいです。
というわけで、
リセットCSSの文は、自分のCSSの前の行に書くようにしてください!
私と同じ落とし穴にははまらないで!( ；∀；)
