pdfHTML 不支持 CSS 样式

Question

是否有 pdfHTML 支持的 CSS 样式列表？他们的网站说 "It supports the parts of the HTML 5 and CSS 3 specification that apply in a PDF context" 这是有道理的（例如，没有理由支持 CSS 动画）。

但是，我认为一些适用于 PDF 的简单样式存在问题。

一个问题是以下样式未应用于图像：

img { max-width: 100%; }

我有几张图片，它们的实际宽度比页面大，所以图片被截断了。我无法更改源 HTML 也无法缩小图像文件。让图像正常运行的最佳做法是什么？

另一个问题与 table 样式有关。这些未被应用：

table { vertical-align: top; }
tr:nth-child(even) { background: #eee; }

就像图像问题一样，这些样式在浏览器中看起来很好。格式化 tables 的推荐方法是什么？

谢谢

Answer 1

max-width CSS 属性在 pdfHTML 中尚不支持。您可以尝试使用自己的自定义 CSS 图像应用程序解决该问题，并在满足某些条件时将宽度重置为您想要的任何值。

首先，为图像创建 CSS 应用程序：

final ICssApplier customImageCssApplier = new BlockCssApplier() {
    @Override
    public void apply(ProcessorContext context, IStylesContainer stylesContainer, ITagWorker tagWorker) {
        super.apply(context, stylesContainer, tagWorker);
        if (tagWorker.getElementResult() instanceof Image) {
            Image img = (Image) tagWorker.getElementResult();
            if (img.getImageWidth() > 500) {
                img.setWidth(UnitValue.createPercentValue(100));
            }
        }
    }
};

然后，确保在工厂中检索到此应用程序。为此，您必须覆盖 getCustomCssApplier:

ICssApplierFactory cssApplierFactory = new DefaultCssApplierFactory() {
    @Override
    public ICssApplier getCustomCssApplier(IElementNode tag) {
        if (TagConstants.IMG.equals(tag.name())) {
            return customImageCssApplier;
        }
        return super.getCustomCssApplier(tag);
    }
};

最后，创建 ConverterProperties 并确保将其传递给 HtmlConverter.convertToPdf:

ConverterProperties properties = new ConverterProperties().setCssApplierFactory(cssApplierFactory);

pdfHTML 不支持 CSS 样式

pdfHTML not honoring CSS styles

html

css

itext7

pdfhtml