wkhtmltopdf print-media-type仅使用@media print而忽略其余部分

Question

我有一个使用一个css文件的html文件.在最底层的这个文件中,我将它用于需要仅应用于页面打印机版本的样式

@media print{
   ....print styles here...
}

当我调用wkhtmltopdf --print-media-type input.html output.pdf时,它会使用仅在@media打印机箱中的样式呈现pdf并忽略其余的样式 - 它们没有指定@media类型

这是正常的,或者我在这里做错了什么？我是否需要在@media print中指定所有打印样式？

Answer 1

wkhtmltopdf有一个--print-media-type你可以传递的参数.这是使用NReco的C#代码示例(仅用于说明目的),但参数应以完全相同的方式工作:

        var converter = new NReco.PdfGenerator.HtmlToPdfConverter();
        converter.CustomWkHtmlArgs = "--print-media-type";
        var pdfBytes = converter.GeneratePdf(html);
        return pdfBytes;

这在C#中使用NReco来使用打印媒体css时效果很好,并且它也考虑了任何不在@media块内的CSS ,例如font-sizea h3.尝试更改文本的大小或类似的内容,看看是否反映了更改.

Answer 2

默认情况下,您定义的任何CSS规则(不使用媒体查询)都适用于所有媒体类型.

因此,wkhtmltopdf --print-media-type将明确使用@media print AND任何其他通用规则.

如果您需要wkhtmltopdf --print-media-type不使用的规则,则必须将媒体查询明确定义为除以下内容之外的任何内容print:

@media screen {
  /* will not be used */
  ...
}

@media print {
  /* will be used */
  ...
}

/* any rules outside specific media queries will also be used */
div.foo {
  ...
}

或者,在HTML with with media="screen"属性中包含CSS文件不会用于wkhtmltopdf --print-media-type:

<!-- will not be used -->
<link rel='stylesheet' href='foo.css' type='text/css' media='screen'>