html - 分页后重复表格标题

Question

打印 HTML 表格时，您可以使用 CSS 强制表格的标题行在分页符后再次显示。这种风格：

@media print {
   thead { display: table-header-group; }
}

结果是：

标题
-------------
Col1 | Col2
-------------
数据1 | 数据2
数据3 | 数据4

- 分页符 - 

Col1 | Col2
-------------
数据5 | 数据6

有没有办法在分页符后也重复表格标题？我认为你可以做类似的事情caption { display: table-caption-group; }，但这不存在。该解决方案需要在 IE9 中运行。

Answer 1

恐怕没有办法做到这一点。原则上，您可以设置caption { display: table-caption-group; }，但根据规范，“如果一个表格包含多个带有 'display: table-header-group' 的元素，则仅将第一个呈现为标题；其他人被视为具有'display：table-row-group'。” 因此，您将无法同时进行 thethead和caption重复。此外，IE 9 甚至不会让您caption单独重复（Firefox 会）。

解决方法是将caption元素转换为作为元素一部分的表格行thead。例如，对于一个两列表：

<table>
<thead>
<tr><th colspan=2>Caption
<tr><th>Header cell <th>Another header cell
</thead>