Whocaresでcssを使う時のコツ

また少し余白を整えました。粗削りに作ってからタニシのように少しずつ少しずつ整えて環境を良くしていくのが趣味です。
知識が足りない頃に作成した表紙のcssで余白調整をずっとミスっており、今回でスマホのスクロール時に画面がズレる問題が解決したはずです。
iPhoneのchromeとsafariでのみの確認で、たぶん僕しか気にしてなかったとは思うのですが、音量同様そういう細かな！気配りがね！大事ですので！！これがモテです！！！

今日はWhocaresでcss(タグ)を使いたい人向けにちょっと書きたいと思います。
僕が今までWhocares掲示板内でのcssについて格闘してきたことのまとめのようなものです。

とりあえず調べて作ってみたけどなんか違うな…みたいな人は参考になるかもしれません。
(cssに関しての知識がまったくない人にはよくわからない内容かもしれません…。cssをなんとなく触ったことのある人が「なりきりサイトの日記板でよく使われるWhocares掲示板」でcssを使うときのコツ、みたいな感じです)

先に何が書かれているか簡単にまとめると

・Whocares掲示板は元々タグが入ってるのでcssがうまく反映されないことがある
・そういうときは元々のタグをリセットするか上書きすることが必要
・元々のタグはこんな感じ
・ただこれは古い知識で今は使われない記述だし調べるのもちょっと面倒)
・だから今からタグ使おうって人用に書きました

そんな感じです。
以下、検証方法から詳しく話していきます。

まず、掲示板内でcss組む際は、元々掲示板自体に設定されたcssがあるため、普通のHPを組むより難しい…というかコツがいります。
最初は特に、あれ？なんか思ってたのと違うなぁ、とか表示されないなぁ…とかあると思うんです。
そういう場合の検証と解決方法を順に書きます。(基本的にPCから試す方法です)

■ 検証方法
1、プレビューを試す
僕はcodepenっていうコードを書いたらすぐ反映してくれるブラウザツールを使用してやっているのですが、そういうツールはいろいろあるので使いやすいものを使用してプレビューしてみてください。
この地点で表示されない・思ってたのと違う場合はcssの組み方が間違っています。
(※ こういったツールでは改行は反映されませんのでそこは気にしなくて大丈夫です。気になる場合はbrタグを足してください)

2、ページを更新する
日記ページはもちろん、外部cssがある場合はそのcssページも同じように更新してください。最悪ブラウザの履歴をクリアしましょう。
一度そのcssで開いてしまうとブラウザはそれを記憶してしまうので、更新が反映されずに表示されていないことがあります。
外部cssを使用している場合、特にこれに引っ掛かりがちです。

ここまでやっておかしい場合はWhocares掲示板にかかっているcssと干渉している可能性があります。

よくある問題は「フォントが反映されない」「文字の大きさが違う」「設定していないのに余白が入った」などです。
次のページで詳しく書きます。