以编程方式将外部 CSS 样式表中的所有 Css 样式添加到 html <head> 标记答案

【问题标题】：Programmatically add all Css stlyings from external CSS stylesheets to the html's <head> tag以编程方式将外部 CSS 样式表中的所有 Css 样式添加到 html <head> 标记
【发布时间】：2014-07-21 23:34:07
【问题描述】：

我正在使用 python 库将 HTML 页面转换为 PDF。

它是正确的，除了它只处理内联样式。它不反映使用外部样式表应用于 DOM 元素的样式。

因此，作为一种解决方案，我正在考虑将所有外部 CSS 样式表中的那些 CSS 样式添加到 html 文件的 head 标记中，然后将其发送以转换为 pdf。

但是，我不知道怎么做？任何人都可以就如何解决这个问题给我任何想法或至少建议吗？或者，如果他们知道更好的解决方案。

非常感谢

【问题讨论】：

标签： javascript python css pdf pdf-conversion

【解决方案1】：

python 是在外部运行还是在客户端运行？您可以在@http://www.xportability.com/XEPOnline/FOTestSuite.html 处查看解决方案。虽然这有很多作用，但您可以通过该页面访问包含的 Javascript。寻找 flattenstyle.js 的灵感。

因为我们的处理方式不同，我们实际上将一个选定的 div 元素复制到另一个隐藏的 div 中，并通过提取我们想要的样式来“扁平化”样式。你可以做的是在页面加载时运行这样一个 javascript 并保存 div 而不是破坏它，然后你就拥有了 HTML 中的大部分打印样式。

【讨论】：

谢谢凯文。根据描述，这个库看起来很有前途。我会试一试。 :)
Kevin - 我不知道如何使用它？是否可以在我的网络应用程序中使用这个库。请注意，除了托管它的服务器外，我的网络应用程序无法访问互联网。所以，我需要在我的应用程序中物理地包含任何外部库，而不是仅仅调用它。如果可能，请告诉我
随着我们的工作，它每天都在变化。该示例中的 JS 代码遍历 div 和所有子项的样式，并创建一个具有所有已解析样式的新 div。如果这就是你想要的，你可以提取/分析和修改（这只是早期的例子，新版本即将到来）。唯一需要的外部连接是格式化为 PDF，因为它使用我们开发的基于 REST 的外部托管 XSL FO 引擎。如果您有自己的 PDF 打印解决方案，则不需要。
注意，如果您使用Chrome浏览器，我们现在将原来的div替换为PDF，并删除处理后的div。您需要进行调试才能访问“中间”（修改后的）HTML div，并解析所有样式。
仅供参考，用于遍历 DOM 并注入所有内部和外部相关 CSS 的 JS 代码现在已发布在 Github 上 @github.com/Xportability/css-to-pdf