打印预览在每个页面上重复tfoot

我的问题是，我有两个不同的html文件，包含一个包含headader，tfooter和tbody的表格。打印预览在每个页面上重复tfoot

第一个是我自己创作测试的原因，它看起来像这样：

<html> 
<head> 
    <title>The Invoice</title> 
    <style type="text/css"> 

    table.invoice { background-color: #dddddd; font-family: sans-serif; } 

    td, th { background-color: #ffffff; padding: 5pt; } 
    td.unit { text-align: right; } 
    td.price { text-align: right; } 

    thead { display: table-header-group; } 
    tfoot th { text-align: right; } 

    </style> 
</head> 
<body> 
    <div style="width:auto !important; overflow:hidden; position:relative"> 
    <table class="invoice" cellspacing="1" cellpadding="0"> 
     <thead> 
      <th>Unit</th> 
      <th>Description</th> 
      <th>Price</th> 
     </thead> 
     <tfoot> 
      <tr> 
      <th colspan="2">Sum</th> 
      <td class="price">1.230,32 EUR</td> 
      </tr> 
     </tfoot> 
     <tbody> 
       <tr><td>1</td><td>Excel</td><td >150,00 EUR</td></tr> 
       <tr><td>2</td><td>Document</td><td>150,00 EUR</td></tr> 
          ... and so on ... 
     </tbody> 
    </table> 
    </div> 
</body> 
</html>

每当我试图在IE9打印预览它显示在最后一页上TFOOT（第5页在我的情况）其中显示了主体内容价格列的总体总和。当我在Mozilla Firefox 11.0中尝试使用相同的功能时，它显示了当前不想要的每个页面上总体总和的tfoot。

我问的主要原因是因为我有一个FreeAgent html dom，我想打印出一些发票。有了这个html文件，即使IE9在每一页上都显示了tfoot，这又是！我不想要。

我

@media print { tfoot { display: table-footer-group; 
       position: absolute;   
       bottom: 0; }}

有它显示的页脚只有一次发挥各地，但在左下的第一页上的所有进行的跨我的文字休息...

想法或解决方案相比，不胜感激！ :)

来源

2012-03-21 PernerOl

tfoot实际上应该是“始终在底部可见”（或沿着这些线），所以Firefox在每页上打印页脚底部都是合理的。

尤其这是因为如果你有表头的单元格来命名列，或正在使用的页脚标签或重复标题非常有用。

您应该将您的总和作为表格末尾的另一行。

来源

2012-03-22 12:33:38

试试这个CSS在你的打印样式表，就会使TFOOT充当另一行还保持这有点像Datatables.net需要正确的语法。

table tfoot{display:table-row-group;}

来源

2015-05-20 04:14:46

打印预览在每个页面上重复tfoot

回答

相关问题