Question

有些日子以来，我的Google Chrome浏览器没有显示特殊字体：带有font-face的CSS。

@font-face {
    font-family: 'Babel Sans';
    src: url('../fonts/babelsans.eot');
    src: url('../fonts/babelsans.eot?#iefix') format('eot'),
         url('../fonts/babelsans.woff') format('woff'),
         url('../fonts/babelsans.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

所有与Safari，Firefox和IE一起正常工作，上周工作正常。有人有同样的问题，有人知道如何解决它？

谢谢，

Answer 1

自Chrome 20更新以来，我遇到了同样的问题。这件事发生在Windows Xp和Mac Os X 10.6.8中。 Safari和Mobile Safari（与Chrome共享WebKit引擎）与Firefox和IE完美匹配。我的css代码与你的完全一样。查看检查器似乎没有下载该字体。有时在我的网站中导航不同的页面（共享相同的css外部文件）时，字体会加载并正确显示。

仍在努力解决这个问题......

编辑：

我设法解决了这个问题。我不知道为什么，但使用这个工作： http://www.fontsquirrel.com/fontface/generator/

我上传了我的字体，获得了css和转换后的文件，将它们上传到我的服务器并替换了font-face声明...... bling！有用！希望对你有用！

Answer 2

现在正在使用，我认为Google已经更新了浏览器。

Answer 3

由于Chrome的更新大约一周，您可以尝试使用旧版本来查明它是否是一个错误（我自己没有注意到任何问题）。在http://www.oldapps.com/google_chrome.php获得一个同时检查您是否在其他与字体相关的CSS值中添加此字体（如果是，请将其停用）。过去有些问题实际上已经解决了，但你永远不知道......

Answer 4

首先：使用此service转换您的字体Stefano先生建议：

稍后使用此CSS代码在您的项目中使用您的字体：

@font-face {
    font-family: 'aljazeeraregular';
    src: url('aljazeera-webfont.eot');
    src: url('aljazeera-webfont.eot?#iefix') format('eot'),
         url('aljazeera-webfont.woff') format('woff'),
         url('aljazeera-webfont.ttf') format('truetype'),
         url('aljazeera-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;

}

body {
    background-color: #eaeaea;
    font-family: 'Aljazeera';
    font-size: 14px;
}

请注意，当您在网站中致电font-family时，您必须使用其原始名称，而不是您在@font-face中声明的名称。

字体与谷歌浏览器

4 个答案: