Question

我已使用外部字体创建了此svg，SVG的该部分如下所示：

<defs>
  <style type="text/css">@import url(https://fonts.googleapis.com/css?family=Cairo|Gloria+Hallelujah|Rokkitt|Shadows+Into+Light|Signika&gt;</style>
</defs>

在Chrome中，这很好用，但是当我尝试将svg加载到GIMP中时，字体丢失了。 GIMP有没有办法渲染Google字体？

完整测试svg：

<?xml version="1.0"?>
<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
 <defs>
      <style type="text/css">@import url(https://fonts.googleapis.com/css?family=Cairo|Gloria+Hallelujah|Rokkitt|Shadows+Into+Light|Signika&gt;</style>

  </defs>
  <style>
     text {
        font-size: 30px;
        font-family: Shadows Into Light;
     }
  </style>

  <text x="20" y="35"><tspan>Test</tspan></text>
</svg>

更新：为使SVG在Gimp或Inkscape中运行：

<?xml version="1.0"?>
<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <style type="text/css">
      <![CDATA[
        @font-face {
          font-family: 'Shadows Into Light';
          font-style: normal;
          font-weight: normal;
          src: local('Shadows Into Light'), local('ShadowsIntoLight'), url('http://themes.googleusercontent.com/static/fonts/shadowsintolight/v3/clhLqOv7MXn459PTh0gXYHW1xglZCgocDnD_teV2lMU.woff') format('woff');
        }

        text {
          font-size: 30px;
          font-family: Shadows Into Light;
        }
      ]]>
    </style>
  </defs>

  <text x="20" y="35"><tspan>Test</tspan></text>
</svg>

Answer 1

问题比外部Google字体更严重：

1）Gimp（或它使用的任何SVG解析器）对语法挑剔（通常样式应在CDATA中）

2）即使进行了CDATA修复（至少在Gimp控制台中停止了讨厌的消息），即使对于系统范围内安装的字体，Gimp也不会遵守font-family样式。

在GIMP

1 个答案: