タグ

ブックマーク / katoshun.com (1)

  • レスポンシブWebデザインのサイトを作るときのMedia Queriesの順番を考えてみた | A40

    ちょうど今レスポンシブWebデザインのサイトを制作しているのですが、Media Queriesで画面サイズ別にCSSを記述していくときにどのような順番で記述すればよいのか、改めて調べてみたらいろいろ迷ってしまいました。 今までいろいろなやり方を試してきたのですが、一度整理してみたいと思います。 記述方法の種類 一般的なMedia Queriesの記述の方法としては、以下のようなやり方があります。(ブレイクポイントを480px、768px、980pxとした場合の例です) 1. PCのスタイルから記述していく方法 デフォルトでPC用のスタイルを定義し、タブレット/スマートフォン用のスタイルはMedia Queriesを使って上書きしていくPCファースト的な方法です。 /* デフォルト:980px以上用(PC用)の記述 */ @media screen and (max-width: 979px

    レスポンシブWebデザインのサイトを作るときのMedia Queriesの順番を考えてみた | A40
  • 1