如何使用 asp.net 打印 HTML 表格。每页的页眉和页脚

发布于 2024-12-02 11:51:47 字数 270 浏览 1 评论 0原文

我有动态生成的 htmltable 。我想打印这张表。其中包含很多页面。当我使用 window.print() 时，它打印成 7、8 页。但我的问题是我需要每页（A4 尺寸）上的页眉和页脚。如何为每个页面设置页眉和页脚。我正在使用 asp.net 和 C#。

我将页眉和页脚放在 .aspx 页面上，但问题是当我打印时数据是动态绑定的，然后打印多页（即 4 或 5 页取决于数据）。因此，页眉位于第一页，页脚位于最后一页，我需要每页都有页眉和页脚，

请向我提供任何建议或替代方法来完成此任务。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

爱的十字路口 2024-12-09 11:51:48

I tried this solution its working.

<style type="text/css">
@media print {
thead { display: table-header-group; }
tfoot { display: table-footer-group; }
}
@media screen {
thead { display: block; }
tfoot { display: block; }
}

 </style>


 <body>
 <table>
 <thead><tr><td>Your header goes here</td></tr></thead>
 <tbody>
  <tr><td>
   Page body in here -- as long as it needs to be
   </td></tr>
 </tbody>
 <tfoot><tr><td>Your footer goes here</td></tr></tfoot>
 </table>
 </body>

I tried this solution its working.

<style type="text/css">
@media print {
thead { display: table-header-group; }
tfoot { display: table-footer-group; }
}
@media screen {
thead { display: block; }
tfoot { display: block; }
}

 </style>


 <body>
 <table>
 <thead><tr><td>Your header goes here</td></tr></thead>
 <tbody>
  <tr><td>
   Page body in here -- as long as it needs to be
   </td></tr>
 </tbody>
 <tfoot><tr><td>Your footer goes here</td></tr></tfoot>
 </table>
 </body>

回复收藏 0 原文

我很OK 2024-12-09 11:51:48

如果您绝对必须有页眉/页脚，则需要在每个 X 表格单元格中插入分页符，其中 X 是您希望在每页上显示的单元格数量。分页符必须复制页眉和页脚。

因此，您的表格将如下所示：

HEADER
<table>
  <tr><td>Cell Data</td></tr>
  <!-- A bunch of rows -->
  <tr><td>Cell Data</td></tr>
  <tr>
    <td>
    Cell Data
    <div class="pagebreak">
      <div>FOOTER</div>
      <!-- Print page will break here -->
      <div class="header">HEADER</div>
    </div>
    </td>
  </tr>
  <tr><td>Cell Data</td></tr>
  <!-- A bunch of rows -->
  <tr><td>Cell Data</td></tr>
  <tr>
    <td>
    Cell Data
    <div class="pagebreak">
      <div>FOOTER</div>
      <!-- Print page will break here -->
      <div class="header">HEADER</div>
    </div>
    </td>
  </tr>
</table>
FOOTER

然后将以下样式添加到您的页面：

<style type="text/css">
@media all
{
    .pagebreak  { display:none; }
}
@media print
{  
    .pagebreak  { display:block; }
    .pagebreak div.header  { display:block;page-break-before:always; }
}
</style>

编辑：我更新了 HTML 以（希望）使其更清楚需要做什么。

If you absolutely have to have a header/footer, you will need to insert a page break into every X table cell, where X is the number of cells you want to appear on each page. The page break will have to duplicate your header and footer.

So, your table will look like this:

HEADER
<table>
  <tr><td>Cell Data</td></tr>
  <!-- A bunch of rows -->
  <tr><td>Cell Data</td></tr>
  <tr>
    <td>
    Cell Data
    <div class="pagebreak">
      <div>FOOTER</div>
      <!-- Print page will break here -->
      <div class="header">HEADER</div>
    </div>
    </td>
  </tr>
  <tr><td>Cell Data</td></tr>
  <!-- A bunch of rows -->
  <tr><td>Cell Data</td></tr>
  <tr>
    <td>
    Cell Data
    <div class="pagebreak">
      <div>FOOTER</div>
      <!-- Print page will break here -->
      <div class="header">HEADER</div>
    </div>
    </td>
  </tr>
</table>
FOOTER

And then add the following style to your page:

<style type="text/css">
@media all
{
    .pagebreak  { display:none; }
}
@media print
{  
    .pagebreak  { display:block; }
    .pagebreak div.header  { display:block;page-break-before:always; }
}
</style>

Edit: I updated the HTML to (hopefully) make it more clear what needed to be done.

回复收藏 0 原文