将 wkhtmltopdf 与 Bootstrap 一起使用 3 删除颜色样式

Question

我正在尝试使用 SSR 包和 wkhtmltopdf 从 Meteor 创建 pdf 报告。事情进展顺利，除了一件事：当我 link bootstrap 3 时，我失去了所有颜色。列格式、table 格式等都很好，但一切都是黑底白字。即使我使用内联 css，我得到的也只是白底黑字。

如果我移除 boostrap link，所有颜色都会按预期出现。

这是我正在渲染的模板：

<Template name="spaceUtilSpacePDF">
    <html>
        <head> 
            <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
            <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
        </head>
        <body>
            <div class="container-fluid">
                <div class="row">
                    <div class="col-xs-4">
                        <div class="well">
                        <table class="table">
                            <tbody>
                                <tr>
                                    <td class="bg-danger"> Stuff</td>
                                    <td style="background-color:blue"> Stuff</td>
                                    <td style="color:red"> Stuff</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                                   </div>
            </div>
            <div style="page-break-after:always"></div>
            <button class="btn btn-danger">Test Button</button>

        </body>
    </html>

</Template>

Answer 1

这可能是因为the following snippet from the HTML5 Boilerplate that's included in Bootstrap v3:

/*! Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css */
// ==========================================================================
// Print styles.

@media print {
  *,
  *:before,
  *:after {
    background: transparent !important;
    color: #000 !important; // Black prints faster: h5bp.com/s
    //...
  }

您可以从 Bootstrap 的副本中删除它，或者尝试覆盖它。

请注意，Bootstrap v4 已删除此代码段。

将 wkhtmltopdf 与 Bootstrap 一起使用 3 删除颜色样式

Using wkhtmltopdf with Bootstrap 3 removes color styles

css

colors

wkhtmltopdf

twitter-bootstrap-3