html - 字体系列显示在开发者工具中，但不适用于 froala 编辑器

Question

我遇到了一个奇怪的问题。我使用 @import url('https://fonts.googleapis.com/css?family=Source+Serif+Pro:400,600,700'); 在 样式中使用来自谷歌的字体。 angular2 元素中的 scss。我在 froala 编辑器中的一个段落中使用字体系列。当我在开发工具中检查该段落的字体系列时，它表明它使用的是正确的字体系列。但是，字体显然不是我使用的字体，因为它看起来完全不同。我试图下载文件并定义一个新的 @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 中。这在某种程度上扰乱了风格。删除它解决了问题。