レスポンシブデザイン

タブレット対応

タブレット端末。これとPCは同じでいいっていうならそれでもいいけど、せっかくなら対応したほうがいい。

@media screen and (min-width: 768px) { // ここに既存のCSSを上書きするCSSを書く } これだけ。だから floatとかwidth とかみんなそれに合うように上書きすればいいだけ。 基本的には元のCSSは書き直さなくても大体はいけるけど、px で一部%にしたほうがいいのは%に直すくらいはやるかも。

PC 対応

@media screen and (min-width: 1024px) { // ここに既存のCSSを上書きするCSSを書く } これだけ。 これら複数のレイアウトをうまく適用するために前もってレイアウトの設計はしっかりとしておいたほうがいい。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする