font-family显示在开发人员工具中，但不适用于froala编辑器

Question

我面临一个奇怪的问题。我在一个angular2项目中使用@import url('https://fonts.googleapis.com/css?family=Source+Serif+Pro:400,600,700');中使用styles.scss的Google中的字体。我在froala编辑器中使用font-family作为段落。当我在开发工具中检查段落的字体系列时，它显示它正在使用正确的字体系列。但是，字体显然不是我正在使用的字体，因为它看起来完全不同。我试图下载该文件并定义一个新的@font-face，但这也不起作用。我不知道如何解决/调试这个问题。

@import url('https://fonts.googleapis.com/css?family=Source+Serif+Pro:400,600,700');
...
p {
     font-family: 'Source Serif Pro', serif;
     font-size: 20px;
}

Answer 1

所以我解决了这个问题。我在编辑器选项中使用了iframe: true，它将所有编辑器内容包装在iframe中。这有点混乱的风格。删除它解决了问题。