Web サイト上の一部のアプリケーションでは、ユーザーがページを直接印刷する機能を提供する必要があります。最もわかりやすいのは、Web サイトが提供するテンプレートに従ってコンテンツを入力し、ユーザーがこのページを印刷するときにクーポン ページを生成することです。 、クーポンです。
もちろん、このページに基づいて画像ファイルを生成し、それを印刷するのが最善の方法です。印刷効果はブラウザの設定には影響されません。
ただし、何らかの理由で、速度を上げるかコストを節約するためにページを画像ファイルとして保存しない場合は、HTML ページを直接印刷することしかできません。これには、ページのデザインにいくつかの追加要件が必要になります。注意する必要があること:
1. style タグの属性を設定します。
<style type=”text/css” media=”print”>
これは、このスタイルで導入または定義されたスタイル属性が印刷時にのみ使用されることを意味します。メディア属性が設定されていない場合、定義されたスタイルはブラウザーと印刷の両方で有効になるため、このようなスタイル すべての通常のスタイルの後に配置されます。たとえば、印刷ページに「印刷と Yahoo 口コミネットワーク」という行があればよいと考えていますが、これはブラウザでは現実的ではありません。
<p class="printTitle">印刷物と Yahoo の口コミネットワーク</p>
次に、統一スタイルで .printTitle{display:none;} を設定し、メディアが「印刷」である後続のスタイルで .printTitle{display:block;} に設定します。定義された印刷スタイルは、印刷時に通常定義されたスタイルよりも高い優先順位を持たないため、すべての通常のスタイルの後に印刷スタイルを配置することをお勧めします。
2. ページを印刷するとき、ブラウザの設定は印刷効果に影響します。IE では、Firefox と同様に、「ツール」-「インターネット オプション」-「詳細設定」に「背景の色と画像を印刷する」があります。 「ファイル」－「ページ設定」に「背景色と画像を印刷する」があり、これを選択するとページ内の背景色と画像を印刷することができます（一部の非標準のIEカーネルブラウザでは印刷できないようです）。問題: 背景色は印刷できますが、背景画像は印刷できません)。これが選択されていない場合、背景色も画像も印刷できません。そのため、ユーザーを異なるブラウザーやブラウザー設定から保護するために、2 つの方法をお勧めします。 1 つ目は、背景色で塗りつぶされた領域を境界として使用し、背景色と同じ色で境界線を追加します。これにより、印刷時に変化が見えなくなります。ユーザーの設定によって背景色が印刷されない場合でも、境界線が分割として使用され、ページ レイアウトが最大のレイヤーに保持される可能性があります。2 つ目は、すべての重要な画像に <img/> タグを使用することです。ユーザーのブラウザの設定に関係なく、これらの画像を印刷できるようにするためです。これは、通常、一部のページが異なる方法でデザインされているのと同じかもしれませんが、印刷効果を統一するには、妥協する必要があります。
私は実際のアプリケーションで遭遇するいくつかの問題を提起しただけです。新しい質問やアイデアがある場合は、最初にここで提案して議論してください。
原文： http://ued.koubei.com/? p=918