我正在尝试使用 SSR 包和 wkhtmltopdf 从 Meteor 创建 pdf 报告。一切进展顺利，除了一件事:当我链接 bootstrap 3 时，我失去了所有颜色。列格式、表格格式等都很好，但一切都是黑底白字。即使我使用内联 css，我得到的也只是白底黑字。
如果我删除 boostrap 链接，所有颜色都会按预期显示。
这是我正在渲染的模板:
<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>
最佳答案
这可能是因为 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 已删除此代码段。
关于css - 将 wkhtmltopdf 与 Bootstrap 3 一起使用会删除颜色样式，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28405505/