打印< div id = printarea>< / div>只要? [英] Print <div id=printarea></div> only?
问题描述
如何打印指定的div(无需手动停用网页上的所有其他内容)?
How do I print the indicated div (without manually disabling all other content on the page)?
我想避免新的预览对话框,窗口与此内容无关。
I want to avoid a new preview dialog, so creating a new window with this content is not useful.
页面包含几个表,其中一个包含我要打印的div - 表格样式为视觉样式
The page contains a couple of tables, one of them contains the div I want to print - the table is styled with visual styles for the web, that should not show in print.
推荐答案
这里是一个常见的解决方案,使用仅CSS
Here is a general solution, using CSS only, which I have verified to work.
@media print {
body * {
visibility: hidden;
}
#section-to-print, #section-to-print * {
visibility: visible;
}
#section-to-print {
position: absolute;
left: 0;
top: 0;
}
}
替代方法不太好。使用 display
很棘手,因为如果任何元素有 display:none
,那么它的后代都不会显示。
Alternative approaches aren't so good. Using display
is tricky because if any element has display:none
then none of its descendants will display either. To use it, you have to change the structure of your page.
使用显示
效果更好,因为您可以转动对后代的可见性。不可见元素仍然影响布局,所以我把 section-to-print
移动到左上角,以便正确打印。
Using visibility
works better since you can turn on visibility for descendants. The invisible elements still affect the layout though, so I move section-to-print
to the top left so it prints properly.
这篇关于打印< div id = printarea>< / div>只要?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!