像我的许多大想法一样,有人先想到了它 :)
对于任何可能遇到这个问题的人,请查看Keyamoon的字体生成器工具。
你可以尝试使用svg-join将多个SVG合并成一个符号集合。
此工具会为您创建两个文件。 第一个是“svg-bundle.svg”:
<svg ...>
<symbol id="svg1" ...>
<symbol id="svg2" ...>
</svg>
.svg_svg1,
.svg_svg2 {
width: 20px; // for example
height: 20px;
}
<link rel="stylesheet" type="text/css" href="svg-bundle.css" />
...
<svg class="svg_svg1"><use xlink:href="svg-bundle.svg#svg1"></svg>
<svg class="svg_svg2"><use xlink:href="svg-bundle.svg#svg2"></svg>
Glyphter.com 处理多路径图标,这可能也是一个很好的资源。