CSS で HTML ソース内にない画像をプリントする

Web ページをプリントアウトすると、IE などでは、デフォルトの設定のままだと背景を印刷できませんが、content 擬似要素を使うことで、印刷のできる画像を CSS だけで追加することができます。

しかし、content 擬似要素は、IE6, 7 ではサポートしていないので、IE 向けに別の方法で画像を追加しなければなりません。IE向けには、list-style-image を使うことで、before + content に近いことができるので、これで代用をします。

この方法で、CSS での画像置換や、印刷用のビジュアルを別で出力したい場合などによいかと思いますがどうでしょうか。

この Web サイトでもこの手法をつかっていますので、このページをプリントプレビューなどで試してみてください。

http://www.yomotsu.net/lab/css/printimage/trackback

この記事へのコメントはまだありません

このページの目次