打印文档时出现嵌套表问题

Question

我有一张我正在尝试打印的表格。所以基本结构是包含嵌套表都包含thead。一旦我做了印刷，pdf显示重叠thead。

请查看附件链接以重新生成代码。 https://www.dropbox.com/s/a0l0s7blh401tg7/table.html

<table> 
    <thead> 
     <tr> 
      <td>heading</td> 
     </tr> 
     <tbody> 
      <tr> 
       <td> 
        <table> 
         <thead> 
          <tr> 
           <th>Heading 2</th> 
          </tr> 
        </table> 
       </td> 
      </tr>    
     </tbody> 
    </thead> 
</table> 

Answer 1

试试下面的CSS （如果你有一个非常简单的THEAD的只有一个藏汉这不仅有助于）：

thead { display: table-header-group } 
tfoot { display: table-row-group } 
tr { page-break-inside: avoid } 

---

编辑：

关于你的问题：你的thead重叠的原因是你的table标记本身。现在我们有多个table和thead，以及导致重叠的填充。我做了一些研究，发现了两种不同的解决方案。

---

事实1：只有在打印时在你的标记的最新的thead会在第二页上的地方。因此，您可以检查和调整你的表像这样working example here, print button on the top：如果你想在所有页面上所有的THEAD信息是把所有th在在我看来唯一可行的解​​决方案：

<table> 
    <!-- thead on first page --> 
    <thead> 
     <tr> 
      <th> ... </th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td> 
       <table> 
        <!-- thead on first page an all following --> 
        <thead> 
         <tr> 
          <th> ... </th> 
         </tr> 
        </thead> 

        <tbody> 
         <tr> 
          <td> ... </td> 
         </tr> 
        </tbody> 
       </table> 
      </td> 
     </tr> 
    </tbody> 
</table> 

---

事实2一个thead在table的顶部，因此您必须在每一页上所有信息working example for this solution, print button on the top

希望这有助于:)