14
14

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

印刷時にbackground-colorが反映されないときの対処法

Posted at

今回のテーマ

ページを印刷する際に背景色が反映されないことがありました。

印刷の際にページと同一の色を付与したいにも関わらず反映されないという事態、、

しかし、これはCSSで解決できるようです。

以下に手順を記します。

chromeだけ適用できる設定

CSSで背景色も印刷時に反映されるように指定をしておく。
※chromeしかないプロパティなのでIEやFireFoxでは使えない。


body {
  -webkit-print-color-adjust: exact;
}

次に、!importantを付けて解決

印刷したい箇所の背景色指定には!importantをつける
!importantを付けない場合、上記の設定をしていても表示されないようです。


th {
  background-color: #fff !important;
}

見事解決できました!

参考

14
14
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
14
14

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?