8

背景画像がいくつかあるレポートページを印刷する必要があります。ただし、これらの画像のみを印刷することはできません。これらの画像は実際にはグラフのロゴであるため、レポートで非常に重要です。

それらを切り抜いてページにタグとして含めることができる別のオプションがありますが、これは最後のオプションです。したがって、その前に、これらの画像を強制的に印刷する方法があるかどうかを知りたいですか？誰かが私を助けることができますか？

4

2 に答える 2

23

デフォルトでは、ブラウザーはページを印刷するときにバックグラウンドの CSS ルールを無視します。CSS を使用してこれを克服することはできません。

ユーザーはブラウザの設定を変更する必要があります。

したがって、印刷する必要がある画像は、CSS の背景ではなくインライン画像としてレンダリングする必要があります。ただし、css を使用して、印刷用にのみインライン イメージを表示できます。このようなもの。

HTML

<div class"graph-image graph-7">
  <img src="graph-7.jpg" alt="Graph Description" />
</div>

CSS

.graph-7{background: url(../img/graphs/graph-7.jpg) no-repeat;}
.graph-image img{display: none;}

@media print{
  .graph-image img{display:inline;}
}

このコードまたは同様のコードを使用すると、画像が html で 1 回、css で 1 回使用されます。html バージョンは css を使用して隠され、印刷用には通常どおり表示されます。これはハックですが、やりたいことを実行します。画像を印刷してくれます。

そうは言っても、あなたがしていることはひどく悪い習慣です。ユーザーに意味のある情報を伝えるものは、css だけを使用して伝えるべきではありません。意味的に正しくないだけでなく、ユーザーにとってグラフの有用性が低下します。インライン画像の方がはるかに優れています。可能であれば、それを使用する必要があります。

于 2012-06-28T11:12:27.517 に答える