谷歌字体未显示在SVG代码中

Question

在这个页面上，我有一个SVG代码。SVG 文件仅显示基本的常规字体类型。虽然，我已经使用了所有字体变体(斜体，粗体，粗体，半粗体，深色(。

我已经尝试了这两种方法，@import方法和链接rel，都在文件和外部CSS中。这些将分别是。

@import url('https：//fonts.googleapis.com/css？family=Vollkorn：400,400i，600,600i，700,700i，900,900i'(;

我还研究了这个解决方案，它使用@font面方法在 SVG 文件中设置(尝试粗体、常规等，但无济于事(：

代码片段：

<!-- Generator: Adobe Illustrator 21.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 viewBox="0 0 5390.3 959.3" style="enable-background:new 0 0 5390.3 959.3;" xml:space="preserve">
<style type="text/css">
	@import {font-family: 'Vollkorn', serif; src: url('Vollkorn/Vollkorn-Bold.ttf')}
svg{font-family: 'Vollkorn', serif;}
.....

Answer 1

你的问题是，即使你正在设置

svg{font-family: 'Vollkorn', serif;}

文本的类过度使用字体系列，规则如下。

.st22{font-family:'Vollkorn-SemiBold';}

"Volkorn-SemiBold"在任何地方都没有定义。 更改您的类，以便它们只使用"Volkorn">

.st22{font-family:'Vollkorn';}

或者完全删除它们，因为它们现在什么都不做。