アキラのＩＴメモ：CSSで背景画像を印刷させる方法

スタイルシートのbackgroundで指定している画像はどうやら印刷時には出てこないようで、それはそれで便利なのですが、印刷したいという場合にどうするのだろうと思って少し調べてみました。簡単な方法としてはブラウザーの設定で「背景イメージを印刷する」と選択すれば印刷できるようなのですが、ユーザにそれを強要するのは難しいところです。こちらのページによるとスタイルシートの記述だけで印刷できるようにするには以下のように記述すれば良いようです。

#title {
  display: list-item;
  list-style-image: url(banner.jpg);
  list-style-position: inside;
  letter-spacing: -1000em;
  font-size: 1pt;
  color: #fff;
}

display: list-item;にして、list-style-imageで印刷させようということみたいです。こちらのサイトでサンプルが公開されていますので興味のある方はどうぞ。

コメントを投稿