Question

伙计们，我需要开发一种能满足以下要求的工具：

输入：在head部分中包含CSS规则的XHTML文档。
输出：带有在标签属性中计算的CSS规则的XHTML文档

说明我想要的行为的最佳方式如下。

示例输入：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
  <style type="text/css" media="screen">
    .a { color: red; }
        p { font-size: 12px; }
  </style>
</head>
<body>
    <p class="a">Lorem Ipsum</p>
    <div class="a">
         <p>Oh hai</p>
    </div>
</body>
</html>

示例输出：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<body>
    <p style="color: red; font-size: 12px;">Lorem Ipsum</p>
    <div style="color: red;">
         <p style="font-size: 12px;">Oh hai</p>
    </div>
</body>
</html>

哪些工具/库最适合此类任务？我不确定BeautifulSoup和cssutils是否能够做到这一点。

Python不是必需的。任何建议都将受到高度赞赏。

Answer 1

尝试使用预购

code.dunae.ca/premailer.web

更多信息： campaignmonitor.com

Answer 2

虽然我不知道有什么具体的工具可以做到这一点，但这是我要采取的基本方法：

加载为xml文档
从文档中提取css类和样式对于每对css类和风格
从css类构造xpath查询对于每个匹配节点
设置该类的样式属性
从文档中删除样式节点将文档转换为字符串

Answer 3

有一个premailer python package on Pypi

Answer 4

取决于你的CSS有多复杂。如果它只是一个简单的元素（“p {}”，“a {}”），ID / Classes（#test {}），那么最容易使用正则表达式。你必须有一个找到所有的样式定义，然后解析它们，然后使用更多的正则表达式来查找匹配的标记实例。

例如，如果您发现A标签的样式，则可以使用正则表达式，如：

<a\b[^>]*>(.*?)</a>

要获得它们，那么你必须进行替换以添加样式。当然，您希望正则表达式接受标记作为参数（在本例中为A标记）。

如果你选择了儿童选择或者除了根元素和ID /类之外的任何东西，这可能会很快变得混乱。

考虑直接定义内联样式？

CSS解析器+ XHTML生成器，需要建议

4 个答案: