印刷した全てのページに不要な背景画像が入ってしまうとき

CSS

ホームページを印刷したときに、ブラウザで見るとページの一番上などに背景画像があるだけなのに、 いざ印刷してみたら印刷した全てのページに同じ背景画像が入っていたりします。

それで文章が読みづらくなければいいのですが、ヘッダーに帯で色をつけたの背景画像だと次の ページの文章とかぶってみえづらくなると思います。

これはbodyなど全体を覆っている要素の背景画像は印刷するとどのページにもその背景が印刷されてしますようです。 bodyの直下のdivなどでも全体を覆っているとアウト。

いろんなサイトが印刷してみるとこういう状態になっているようです。

解決法

自分みつけた解決方法としてはその背景画像を全体で覆わないようなHTML構造で作成するか、 印刷するときはその背景画像を表示しないようにCSSで設定します。

蛇足

印刷用CSSでよくナビゲーションなど消すことがありますが、どうなんでしょう。 ブラウザで見たそのままの画面を印刷したい人もいるようですが。 選べればいいんでしょうけども。