Css ckeditor：使用Google字体作为内联编辑器样式？

我正在使用CKeditor，希望编辑器窗格的内容与我的站点发布页面上显示的内容尽可能匹配。这包括使用专门的谷歌字体（'Lato:300'，）

但是我找不到任何方法让编辑器使用这种字体？css似乎忽略了它（我真的不明白为什么？）

（注意：我正在尝试将字体用作编辑器窗格中所有文本的默认字体，而不仅仅是样式下拉列表中的额外选项）

---

谢谢。

您确定设置正确吗？我刚刚测试了这个，它对我有效（contents.css）：

---

您确定设置正确吗？我刚刚测试了这个，它对我有效（contents.css）：

---

Nenotlelp的解决方案不适用于不支持WOFF字体的浏览器。更好的方法是使用添加webfonts的CSS文件。例如：

config.contentsCss = [
    CKEDITOR.getUrl('contents.css'),
    'http://fonts.googleapis.com/css?family=Roboto+Condensed:400,700'
];

---

Nenotlelp的解决方案不适用于不支持WOFF字体的浏览器。更好的方法是使用添加webfonts的CSS文件。例如：

config.contentsCss = [
    CKEDITOR.getUrl('contents.css'),
    'http://fonts.googleapis.com/css?family=Roboto+Condensed:400,700'
];

---

---

为什么不在你的ckEditor中包含一个指向你的网站样式表的链接呢？嗨，Coop，我不确定你所说的“在我的ckEditor中”到底是什么意思？我已经在contents.css文件中包含了font-family属性，cke就是从这个文件中获取样式的，正如我所说的，它被忽略了。我在页面上任何其他样式表上面以及在ckeditor代码之前包含的导入代码；你能在那里设置一些简单的设置，比如颜色：#c0ff33；？你好，尼诺，是的，我可以设置颜色，背景色&也许还有一些其他属性。。。但不是字体。@Inigo当ckeditor加载时，它位于iframe中，因此将字体代码放在同一页上是没有用的。CKeditor具有通过config.js文件链接整个样式表的功能。这样，您可以确保每个样式都是相同的，而不仅仅是字体！为什么不在你的ckEditor中包含一个指向你的网站样式表的链接呢？嗨，Coop，我不确定你所说的“在我的ckEditor中”到底是什么意思？我已经在contents.css文件中包含了font-family属性，cke就是从这个文件中获取样式的，正如我所说的，它被忽略了。我在页面上任何其他样式表上面以及在ckeditor代码之前包含的导入代码；你能在那里设置一些简单的设置，比如颜色：#c0ff33；？你好，尼诺，是的，我可以设置颜色，背景色&也许还有一些其他属性。。。但不是字体。@Inigo当ckeditor加载时，它位于iframe中，因此将字体代码放在同一页上是没有用的。CKeditor具有通过config.js文件链接整个样式表的功能。这样，您可以确保每个样式都是相同的，而不仅仅是字体！另外，请确保您没有从缓存加载contents.css！天啊！成功了！出于某种原因，我甚至没有尝试在contents.css中使用@font-face，我一直坚持使用编辑HTML页面头部的样式表链接。我认为这个问题与将这个字体应用到保存ckeditor内容的iframe有关。。。相反，contents.css与iFrame一起加载，所以我想这就是它工作的原因吧？无论如何，非常感谢。不幸的是，此解决方案仅适用于支持WOFF字体的浏览器。此外，请确保您没有从缓存加载contents.css！天啊！成功了！出于某种原因，我甚至没有尝试在contents.css中使用@font-face，我一直坚持使用编辑HTML页面头部的样式表链接。我认为这个问题与将这个字体应用到保存ckeditor内容的iframe有关。。。相反，contents.css与iFrame一起加载，所以我想这就是它工作的原因吧？无论如何，谢谢，非常感谢。不幸的是，此解决方案仅适用于支持WOFF字体的浏览器。实际上，为了兼容性，这样做可能更好。为了兼容性，这样做可能更好。