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

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; 
     } 
    }