今回はレスポンシブデザインに便利なcssについてのお話です。 レスポンシブデザインに対応するためにはまず、ビューポートをヘッダーに記述して、メディアクエリのブレイクポイントによってデバイスごとにcssを切り替えます。 WordPressの場合だと、すでにテンプレートの時点でレスポンシブデザインが導入されていて、ご自分でカスタマイズする必要がないものもありますよね。 しかし、そういったCMSを使用していない静的なWebサイトの場合だと、自身でスマホ対応するためにレスポンシブデザインを導入する必要があります。(レスポンシブデザインとは、スマホに対応する色々な手段のうちのひとつです。) その際、レスポンシブデザインに対応するために、特に便利なcssを個人的にまとめてご紹介したいと思います。 display:none; PCとスマホでどうしても異なる画像やコンテンツを表示したい場合に指定します。