1

我有以下 HTML 和 CSS：

<div id="previewBox" style="background: #1e5799;
background: -moz-linear-gradient(top,  #1e5799 0%, #7db9e8 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(100%,#7db9e8));
background: -webkit-linear-gradient(top,  #1e5799 0%,#7db9e8 100%);
background: -o-linear-gradient(top,  #1e5799 0%,#7db9e8 100%);
background: -ms-linear-gradient(top,  #1e5799 0%,#7db9e8 100%);
background: linear-gradient(to bottom,  #1e5799 0%,#7db9e8 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 );
height:800px;border: 1px solid black;">
<font style="font-size:100pt;family:georgia;color:#3333FF">Some blue text here...</font>
</div>

我想使用 html2pdf 将其转换为 PDF，但它似乎不起作用。是否可以使用 html2pdf 转换渐变？

4

2 回答 2

0

这取决于您如何将其转换为 PDF。如果您使用 PHP，您可以通过 PHP 的 GD 库生成图像并将其设置为 div 的背景。

找到了一个你可以在这里使用的例子和一个活生生的例子

然后将您的 div 的样式属性更改为：

  <div id="previewBox" style="background-image: url('path/to/gradiant.php?start=1e5799&end=7db9e8">

不要忘记在 PHP 中更改生成的背景渐变的宽度和高度。最佳做法是 1 像素的宽度和 div 的高度。

于 2013-01-23T12:00:34.430 回答
0

I decided to not use html2pdf, but just use the core tcftp which does support linear gradients.

于 2013-01-26T13:26:45.147 回答