レシポンシブデザイン

どうもこんばんわ。

今日はレシポンシブデザインついて勉強しておりました。

レシポンシブデザインって、スマホやタブレットなど、画面サイズが違う端末でWeb画面を見たときに、そのサイズごとのデザインで表示することようにデザインするってことなんですね。

CSSって記述の上から順に上書きされていくようなイメージらしいので、

• スマホの表示（条件なし）
• タブレットの表示（画面サイズが400px以上の場合）
• PCの表示（画面サイズが900px以上の場合）

みたいな感じで記述していくと、400px以上の画面で見たとき、タブレットの表示用に記述したCSSが反映され、900px以上の画面で見たとき、PCの表示用に記述したCSSが反映されるといった感じ。

ちょっと文字だけじゃわかりにくいので、ソースコードでも載せようと思ったのですが、はてな記法の使い方がよくわかってないやら、めちゃ眠くなってきたやらで今日はこの辺にしておきます。

はてなブログについても勉強しないとなー。