将 SVG 转换为使用内联样式答案

【问题标题】：Convert SVG to use inline styles将 SVG 转换为使用内联样式
【发布时间】：2021-08-23 13:51:33
【问题描述】：

如何将 SVG 转换为在 Python 中使用内联样式？例如，我想转换这个：

<svg xmlns="http://www.w3.org/2000/svg" id="Layer_1" data-name="Layer 1" viewBox="0 0 576 576">
 <defs>
  <style>.cls-1{fill:#d1b037;stroke:#1e1e1e;stroke-width:0.25px;}</style>
 </defs>
 <rect class="cls-1" width="576" height="576"/>
</svg>

到

<svg xmlns="http://www.w3.org/2000/svg" id="Layer_1" data-name="Layer 1" viewBox="0 0 576 576">
 <rect class="cls-1" width="576" height="576" fill='#d1b037' stroke='#1e1e1e' stroke-width='0.25px'/>
</svg>

这是一个简单的例子。我需要支持不同的元素，例如 path 以及共享同一组属性的多个类。

Python 中有 SVG/XML 解析器，但没有用于解析样式标签。如果用另一种语言/工具更容易做到，我会接受的。

【问题讨论】：

tinycss.readthedocs.io/en/latest 或许

标签： python svg

【解决方案1】：

没有自动的方法来做到这一点 - 你必须耦合一个 XML 解析器，这样你就可以获取 style 标记的内容，然后将其提供给 CSS 解析器 - 比如 tinycss（链接在cmets）-

然后由您来检索 CSS 解析器返回的对象并将规则与 ramining SVG 标签匹配 - 并且，在匹配时，将规则复制到其 style 标签（或者，根据您的需要 - assemple解析器给出的样式规则中的 XML 属性）。

这是一些工作，但考虑到 CSS 解析器的文档应该或多或少简单明了。

【讨论】：

是的，这就是我现在正在做的事情。

【解决方案2】：

我编写了一个简单的工具，可以将最常见的 defs/style-node-format-using-class-selectors SVG 转换为单一样式属性的 SVG：https://github.com/doom-goober/svg_style_attribute/tree/master

工具搜索：https://github.com/scour-project/scour 然后将单样式属性 SVG 转换为内联样式属性 SVG。

使用这两个工具，您可以从基本的 defs/style-node SVG 到单样式属性 SVG 再到内联样式属性 SVG。

【讨论】：