指定された div を印刷するにはどうすればよいですか (ページ上の他のすべてのコンテンツを手動で無効にせずに)?
新しいプレビュー ダイアログを表示したくないので、このコンテンツを含む新しいウィンドウを作成しても意味がありません。
このページにはいくつかのテーブルが含まれており、そのうちの 1 つに印刷したい div が含まれています。テーブルは Web のビジュアル スタイルでスタイル設定されており、印刷時には表示されないはずです。
ベストアンサー1
ここでは、 CSS のみを使用した一般的な解決策を示します。これは動作することが確認されています。
@media print {
body {
visibility: hidden;
}
#section-to-print {
visibility: visible;
position: absolute;
left: 0;
top: 0;
}
}
ありますコードサンドボックスこれを実際に確認したい場合は、プレビューの上にある [新しいウィンドウで開く] ボタンをクリックすると、ブラウザの [印刷] コマンドを使用して印刷のプレビューを表示できます。
代替アプローチはあまり良くありません。displayいずれかの要素に が含まれている場合、その子孫も表示されないため、 を使用するのは困難ですdisplay:none。 使用するには、ページの構造を変更する必要があります。
子孫の可視性をオンにできるので、を使用するvisibilityとより効果的です。ただし、非表示の要素はレイアウトに影響するため、section-to-print適切に印刷されるように左上に移動します。