web関連

レスポンシブサイトを印刷する際にスマホ表示になってしまう問題を解決する

レスポンシブサイトのサイトで印刷する際に、スマホ表示になってしまう場合がある。
そこでレスポンシブサイトを印刷する際にPC表示で印刷する方法を紹介します。

レスポンシブサイトを印刷する際にスマホ表示になってしまう問題を解決する

では、早速問題を解決していきます。
今回の原因として、レスポンシブサイトのメディアクエリの書き方です。

普段レスポンシブサイトで使用しているメディアクエリ

普段レスポンシブサイトで使用しているメディアクエリはこちら。

この書き方の場合、SPの表示になってしまうようです。
そこで、今回は下記の書き方に変更することで、今回の問題であるレスポンシブサイトの印刷時にPCで印刷することができるようになります。

印刷時PC表示にするためのメディアクエリ

これだけ!
簡単ですね!

ABOUT ME
シラツキ
当ブログは同人サークル「にんじんみるく」のシラツキが運営する個人ブログです。 同人誌即売会の情報やネタ、技術的な内容など様々なコンテンツを配信しています。 普段はwebサイト作ってる人インターネッツお絵かきマン。 Webサイトの制作、ECサイトの運営、ブログ、イラスト制作など色々やってます。 個人でWeb技術ブログ、趣味のブログ、YouTube活動中。

イラスト制作、webサイト制作、商品のご紹介など様々なお仕事を募集しております! 下記リンクよりお気軽にご連絡ください!

お仕事・ご依頼について

COMMENT

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)