web-dev-qa-db-ja.com

wkhtmltopdf print-media-typeは@media printのみを使用し、残りは無視します

1つのcssファイルを使用するhtmlファイルがあります。一番下のこのファイル内で、ページのプリンターバージョンにのみ適用する必要があるスタイルにこれを使用します

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

Wkhtmltopdf --print-media-type input.html output.pdfを呼び出すと、@ media印刷エンクロージャー内にのみあるスタイルでpdfがレンダリングされ、@ mediaタイプが指定されていない残りのスタイルは無視されます

これは正常ですか、ここで何が間違っていますか? @media print内ですべての印刷スタイルを指定する必要がありますか?

12
Hill

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ブロックなど、font-sizeh3。テキストのサイズなどを変更して、変更が反映されているかどうかを確認してください。

14
Peter Morris

デフォルトでは、メディアクエリを使用せずに定義した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 {
  ...
}

または、CSSファイルをmedia="screen"属性を使用してHTMLに含めることは、wkhtmltopdf --print-media-typeでは使用されません。

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