【问题标题】:CSS Table footer with fixed position具有固定位置的 CSS 表格页脚
【发布时间】:2011-07-20 08:58:52
【问题描述】:

我已经建立了一个简单的网页,所以你可以看到a live example

非常简单的表格,定义了 thead、tfoot 和 tbody。带样式定义:

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

我将页眉和页脚设置为在打印时显示在每一页中。但是在最后一页,页脚被放置在表格的末尾,而不是页面的底部(在打印预览中查看)。

我尝试了很多方法:固定位置放置,尝试为tbody设置固定大小,但都没有奏效。

我需要一个至少可以在 IE 和 Firefox 中运行的解决方案(当然,如果它可以跨浏览器运行那就太好了)

【问题讨论】:

  • 谢谢凯尔。我将文件移动到另一个域,希望它现在可以工作

标签: html css printing css-tables


【解决方案1】:

如果您需要将页脚放在固定位置,您可以将其从表格中移出并放置在页面上的固定位置(尽管根据纸张尺寸,它可能无法正确打印!),但最重要的因素是这里是你需要有一个固定的内容高度。

了解内容会将页脚推到底部,这就是为什么您的页脚不在内容底部而是位于内容底部的原因。

顺便说一句,我无法查看您失败的示例...

【讨论】:

  • 谢谢杰克。我正在修复链接,将文件移动到另一个主机,希望它现在可以工作。另外 - 在 self div 元素中分离页脚的想法 - 我尝试过,但问题是 - 你注意到 - 不能为内容设置恒定的高度。表是从数据库动态生成的,我不知道它会持续多久
  • 我也有同样的问题,制作一个固定位置的 div 不是解决方案,对于从第二页开始的表格...在这种情况下,表格页脚应该从第二页向前打印
猜你喜欢
  • 2016-12-01
  • 2018-11-05
  • 2020-06-20
  • 1970-01-01
  • 2018-08-09
  • 2012-10-26
  • 2018-07-17
  • 2011-05-10
  • 1970-01-01
相关资源
最近更新 更多