问

将打印区域限制为div

发布于 2023-02-13 08:53

有没有办法只在Windows上的IE8中使用css(而不是javascript)打印嵌套的"id = printarea"div(带样式)？


    This should NOT be shown in Print Preview
    ONLY this should be shown in Print Preview
    one one
one one

one	one
one	one

我尝试过使用css,但由于继承,它显然没有显示任何内容.以下示例显示了我的意图.

@media print {
    * { display:none; }
    #printarea { display:block; }
}

我已成功使用javascript(有效),但我认为它不是一个优雅的解决方案,因为我必须在document.write中提取所有css导入和样式块.

function printDiv(divId){
    var divToPrint = document.getElementById(divId);
    newWin= window.open();
    newWin.document.write('');
    newWin.document.write(divToPrint.innerHTML);
    newWin.document.close();
    newWin.focus();
    newWin.print();
    newWin.close();
}

示例: http ://jsfiddle.net/D7ZWh/2/

相关: 覆盖父级的CSS显示属性

1 个回答

您必须将所有其他内容放入html元素(请注意p标记)

<body>
  <p>This should NOT be shown in Print Preview</p>
  <div id="main">
   <p>This should NOT be shown in Print Preview</p>
   <div id="printarea">ONLY this should be shown in Print Preview</div>
  </div>
</body>

然后,您可以隐藏父项下面的所有其他元素.为层次结构中的每个父项执行此操作

@media print {
   body *, #main * { display:none; }
   #main, #main #printarea, #main #printarea * { display:block; }
}

编辑:

这与仅打印一个div的第二个答案非常相似

2023-02-13 09:02 回答

灬毋黑色灬_447

撰写答案

今天，你开发时遇到什么问题呢？

立即提问

热门标签