如何让wkhtmltopdf显示th和td背景渐变?

sto*_*roz 6 css pdf webkit wkhtmltopdf

我需要在页面中的某些td和th元素中添加背景渐变,然后转换为PDF,但是我从wkhtmltopdf获得了一些非常奇怪的行为,所以当我这样做时:

table {
  width: 100%;
  border-collapse: collapse;
}

th {
  height: 60px;
  border: 1px solid Black;
}

td {
  height: 100px;
  background: -webkit-linear-gradient(top, #ccc 0%, #888 100%);
  border: 1px solid Black;
}
Run Code Online (Sandbox Code Playgroud)
<table>
  <tr>
    <th></th>
  </tr>
  <tr>
    <td></td>
  </tr>
  <tr>
    <td></td>
  </tr>
</table>
Run Code Online (Sandbox Code Playgroud)

th的高度似乎以某种方式侵占了每个后续的td.如果我移除th或将其高度设置为td高度的整数倍,则一切都很好.

任何人都能了解这里发生了什么?我的HTML很难改变所以我希望能够单独使用CSS或wkhtmltopdf设置来实现这一点.

编辑:

赏金到期前的一些截图:

以下是它在webkit浏览器中的外观:

在此输入图像描述

这是wkhtmltopdf对它的作用:

在此输入图像描述

还有一个进一步的观察:它不一定是引起问题的,因为将它改为类似的目标<td class='th'>会产生同样的效果.

Waq*_*han -1

此页面使用内联 css 转换为 pdf。