Chrome で背景色や背景画像を印刷する

Chrome は単体で PDF を印刷する機能を持ってて便利なんですが、CSS の background-color や background-image が反映されません。

「背景を印刷」みたいなオプションも見当たらなかったので、無理なんかなーって思ってたんですが、どうやら CSS で解決できるっぽいです。

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

人様のページであっても、デベロッパーツールを使えばなんとかなります。

-webkit ってベンダープレフィックスが付いてますが、Safari 5 では動きませんでした。
未だに Snow Leopard を使ってるもんで、Safari 6 は確認できてません。

以下、参考にさせてもらいました。

TIP: Print CSS backgrounds in Google Chrome & Safari webkit

おまけ

各ブラウザが「背景を印刷」的なオプションを持ってるのか、気になったのでついでに調べてみました。

IE 9

"ページ設定" → "背景の色とイメージを印刷する"

Firefox 15

"ページ設定" → "背景色と背景画像も印刷"

Opera 12

"印刷オプション" → "背景を印刷する"

Chrome 21

見当たらず

Safari 5 (Windows)

見当たらず (ていうか Windows 版の Safari は終了っていう認識でいいの？)

Safari 5 (Mac)

"プリント" → "プリンタ" の右の下矢印 → "背景をプリント"

設定さえすれば大体どのブラウザでも印刷できるんですね。設定さえすれば。