html - 在 HTML 中打印多页表格时,仅重复 THEAD 中的某些行

标签 html css

我需要在打印巨大的 HTML 表格时使用这个技巧:

+-----+---------+-----+
|  ID |  Title  | Qty |  ⇐ descriptive header that shouldn't repeat
+-----+---------+-----+
|  1  |    2    |  3  |  ⇐ column number that **SHOULD** repeat
+-----+---------+-----+
| aaa | bbb     |   0 |  ⇐ data; rows upon rows of data

  ...     ...     ...

+-----+---------+-----+
|  1  |    2    |  3  |  ⇐ page 2
+-----+---------+-----+
| xxx | yyy     | 999 |
  ...     ...     ...

是否可以在不诉诸“固定布局的 2 个表”解决方案的情况下实现(我真的不想使用固定值)?哦,我只能使用 HTML 和 CSS。

如果有帮助,我只针对 IE(6 及更高版本)。

更多信息

到目前为止,我已经尝试了这些不同的技巧,但都无济于事:

  1. 没有 thead,第二行得到 th 而不是 td

    1.1。即使在 tr

  2. 上使用 style="display:table-header-group"
  3. thead 中,第一行使用 td 而不是 th

    2.1。在 thead 上使用 style="display:table-row-group",在第二个上使用 style="display:table-header-group"排在里面

  4. tbody 中间插入 thead 的变体(根据消失的答案之一)

我开始接受这是不可能的,我将不得不求助于固定的布局设置(但我祈祷只留下一个灵活宽度的列就足够了):-(

最佳答案

支持仍然很少,但您可以使用正确的渲染器来做到这一点:

文档: http://www.w3.org/TR/css3-page/http://dev.w3.org/csswg/css-gcpm/

支持的热门引擎: http://weasyprint.org/docs/features/http://www.princexml.com/doc/9.0/page-headers-footers/

我也在努力获得 WKHTMLTOPDF 中的支持

关于html - 在 HTML 中打印多页表格时,仅重复 THEAD 中的某些行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7041245/

相关文章:

html - CSS3 Firefox 径向渐变消失

html - 无序列表的 css 问题(与 IE 一样)

html - :hover 上链接周围的等长背景框

javascript - 图片上传前,先对图片进行排序

javascript - 如何让 karma 浏览器使用深色主题?

javascript - 使用在组件类中找到的变量修改伪元素属性值的 Angular/Mobile 友好方式是什么?

jquery - 具有静态内容的砌体和加载更多按钮

css - 谷歌浏览器字体效果不佳

javascript - 通过javascript检测浏览器换行

javascript - backstretch 导致 chrome 中的其他背景图像出现问题