Question

我在网页中创建了需要打印的表格。在主页面上，我有一个printerFriendly按钮，打开一个新选项卡，只显示我需要打印的表格和内容。当我转到新标签并尝试打印或获得打印预览时，它完全是空白的。代码中有一些设置或其他东西可以解决这个问题吗？我也在使用angularjs。这发生在Chrome和IE中。任何帮助表示赞赏。 *如果需要显示任何代码，请告知。不确定是代码还是打印设置。

此代码可让内容显示在打印预览中 已更新

   @media print {

    body *{
        font-family: 'Open Sans', sans-serif;
        font-size: 12px;
        font-weight: 500;
        color: #101010;
        background: #f6f5fa;
        visibility: hidden;
    }
  #section-to-print, #section-to-print *{
    visibility: visible;
  }
  #section-to-print {
    position:absolute; 
    left:0;
    top:0;
  }

   #section-to-print2, #section-to-print2 *{
    visibility: visible;
  }
  #section-to-print2 {
    position:absolute; 
    left:0;
    top:0;
  }

}

Answer 1

请检查以下代码，在打印预览中显示内容。

JS Fiddle

HTML：

    <a href="javascript:window.print()">Print this page</a>
    <br>
    <div id="section-to-print">
      I crea    ted tables in a web page that I need to print. On the main page I have a printerFriendly button that opens a new tab that shows just the table and content I need printed. When I go to the new tab and try to print or get a print preview, it is completely blank. There is some setting or something in the code I can do to fix this? I am also using angularjs. This happens in Chrome and IE. Any help is appreciated. *If any code needs to be shown, please let know. Not sure if it is the code or the print settings.
    </div>

CSS：

        @media print {
        body *{
            font-family: 'Open Sans', sans-serif;
            font-size: 12px;
            font-weight: 500;
            color: #101010;
            background: #f6f5fa;
            visibility: hidden;
        }
      #section-to-print, #section-to-print *{
        visibility: visible;
      }
      #section-to-print {
        position:absolute; 
        left:0;
        top:0;
      }
    }

打印网页不会显示打印视图并打印为空白

1 个答案: