(附录:这是 Chrome issue 631222，已在 Chrome 版本 54.0.* 中修复。)
在 Windows 和 Mac 上使用最新版本 (53.0.2785.116) 的 Chrome，我们遇到了一个我们似乎无法解决的严重错误。
我们正在寻找不涉及编辑 HTML 文本的解决方法，因此 CSS 或 Javascript 答案可能会这样做。
我们在页面顶部获取文本，而不是第一个看起来像这样的文本:
这是一个段落的叠加层，以及该页面后面出现的表格的两个不同表格标题。 (再次打印标题的位置。)
您可以找到完整的 example page here.
当然，我们已经将此报告给了 Google，但我们想知道是否有人可以想出一种解决方法让我们的客户再次打印。我们不能更改 HTML，但我们可以更改 CSS，或者可能使用 Javascript。 (例如，删除 thead 标签似乎可以解决问题，但该解决方案对我们不起作用，因为我们无法更改 HTML。)
代码很简单:
<!DOCTYPE html>
<html><head>
<title>Broken Printing</title>
</head>
<body>
<h1>Printing Issue 9/29/2016</h1>
<p>Lorem ipsum for page break</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<p>Lorem ipsum</p>
<table>
<thead><tr><th>Survey</th></tr></thead>
<tbody><tr class="odd"><td>The Foundation 2016 </td></tr></tbody>
</table>
<table>
<thead><tr><th>Year</th></tr></thead>
<tbody><tr><td>2015</td></tr></tbody>
</table>
</body>
</html>
最佳答案
我们有一个解决方法:
@media print {
thead {
display: table-row-group
}
}
这失去了一个我们在报告中不需要太多的功能——在分页符处重复表格标题——所以它对我们来说已经足够了，并且在 Chrome 修复后很容易被删除。
关于html - Chrome 打印错误 - 在页面顶部错误地打印表格标题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39776056/