印刷用CSSを確認しながら設定する簡単な方法｜Chrome利用

taupe

Chrome DevToolsで印刷用CSSを確認する方法 Chrome DevToolsのRenderingでprint mediaをエミュレートし、印刷用CSSを確認した2017年の記録。現在はChrome公式とMDNの印刷CSS情報を確認して読みます。

今更なのですが、本日は印刷用CSSの話題。 と言っても、記述方法ではなく、デバッグ方法についてです。 個人的にはウェブサイトを印刷することなんて年に一回もないのですが、ウェブサイトを制作する上では、印刷時の見せ方を指定したいという要望が時々あるんですよね。 設定方法は特に難しいこともないのですが、面倒なのはその確認方法。 CSSの記述を変更しては、ページを更新して「command + P」してプリント画面を出して確認したりと。 それが今回の方法だと、通常画面と同様にリロードするだけで反映させることができます。

関連記事

関連キーワード