Bootstrap CSS 不适用于 weasyprint答案

【问题标题】：Bootstrap CSS is not applied in weasyprintBootstrap CSS 不适用于 weasyprint
【发布时间】：2018-09-04 21:20:38
【问题描述】：

我制作了一个烧瓶应用程序，它使用 weasyprint 从 html 生成 .pdf 并将其作为附件发送。但显然没有应用 bootstrap 4 css。我找不到解决方案。它适用于 pdfkit，但我需要 weasyprint，因为 pythonanywhere.com 不支持 pdfkit。

我尝试过链接 bootstrap，在我的 html 中使用 bootstrap css 作为文件，但没有区别。

这是我的python部分，它生成并发送pdf。

@app.route('/pdf_send', methods=('GET', 'POST'))
@login_required
def pdf_send():

    rendered = render_template(
    'pdf_send2.html', 
    name=name_g, 
    surname=surname_g,
    email=email_g,
    address=address_g,
    invoice_no=invoice_no_g,
    dict_g=dict_g,
    bendra_suma_g = ('%.2f' % round(float(bendra_suma_g[0]), 2)),
    send=send_g,
    today=today_g
    )

    css_file = ('static/bootstrap.css')
    filename = 'SF-' + invoice_no_g +'.pdf'
    html = HTML(string=rendered)
    css = CSS(filename=css_file)
    html.write_pdf(filename, stylesheets=[css])
    send_email(filename, email_g)

    return redirect(url_for('index'))

【问题讨论】：

您是否尝试过读取引导 css 的本地副本并将其手动添加为巨型字符串？并不是说它很有效，但这将是一个很好的故障排除步骤。我找不到表明直接支持外部 css 文件的文档。 weasyprint.readthedocs.io/en/latest/…
还是和之前一样的结果。不知何故，weasyprint 无法与 bootstrap 相处。
您确定没有导入或其他“现代”css 功能吗？这可能是它不兼容的原因。在我看来，从文档中可以看出 weasyprint 明确支持特定的 css 功能，仅此而已。
所以我删除了 Bootstrap，但在同一个 html 中添加了自定义 css。无法使 weasyprint 与 Bootstrap 一起工作。
我认为答案是 weasyprint 是个坏主意。似乎极其有限。我会重新审视使用它的要求。

标签： python css flask bootstrap-4 weasyprint

【解决方案1】：

我知道这是一个旧线程，但我在寻找相同问题的答案时偶然发现了它，所以我添加了我的解决方法，以防它对其他人有所帮助。我将首先指出，尽管这确实有效，但 Bootstrap 确实不打算用于打印，并且 weasyprint 会忽略 @media 查询中的任何内容，因此无论如何您都需要添加大量 css为了让它正确渲染所以它可能不值得。

使用原始问题中的代码，如果您将引导 cdn css 添加到 stylesheets 列表中，它将呈现：

html = HTML(string=rendered)
css = CSS(filename=css_file)
html.write_pdf(filename, stylesheets=[css, "https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"])

但是，考虑到 Bootstrap 渲染的问题，我发现这个技巧对于应用字体非常有用。

【讨论】：

css_file 变量中引用了哪个文件？它是一些自定义 CSS 还是引导本地副本？我以某种方式尝试过，但它没有按应有的方式渲染。 col-md* 类未正确呈现。
@Volatil3 您是否将col-md* 正确打印到PDF？如果是这样，您能指出解决方案吗？
对不起，css_file 是你自定义的css。 Bootstrap 被添加到样式表调用中。恐怕我使用自定义 CSS 使列在 pdf 上的大小正确。因为它总是相同的大小，所以不需要响应（对于我的用例）。

【解决方案2】：

weasyprint 不适用于 bootstrap。

为了清楚起见，这是参考Link to Github site。

WeasyPrint 将忽略您编写的任何引导类。

您可以在 WeasyPrint 错误日志中看到“已忽略...”消息（如果您曾经启动过）。

所以最好使用 CSS 来打印页面

【讨论】：