@font-face 不在本地或浏览器中显示答案

【问题标题】：@font-face not displaying locally or in browser@font-face 不在本地或浏览器中显示
【发布时间】：2014-08-05 20:46:29
【问题描述】：

我似乎根本无法让我的@font-face 工作，无论是在本地还是在浏览器中预览时。我的 CSS 如下：

@font-face { 
 font-family: chopin-script.regular;
 src: local('chopin-script.regular'),
 url('/fonts/chopin-script.regular.ttf') format('truetype'); 
}

我的文件夹结构：

HTML： 站点文件夹 > HTML 文件

CSS： 站点文件夹 > CSS 文件夹 > CSS 文件

字体：站点文件夹>字体文件夹>字体文件

我已经解决了所有其他类似的问题，据我所知，我已经完成了所说的一切，但无济于事，如果有什么我没有尝试过的地方，我深表歉意看到。我也用 .otf 版本的字体尝试过同样的代码。

问候。

编辑：

我使用 FontSquirrel 生成字体，并安装它：

@font-face { 
font-family: 'ChopinScript'; 
src: url('/fonts/ChopinScript.eot'); 
src: url('/fonts/ChopinScript.eot?#iefix') format('embedded-opentype'),url('/fonts/ChopinScript.woff') format('woff'), url('/fonts/ChopinScript.ttf') format('truetype'), url('/fonts/ChopinScript.svg#webfont') format('svg'); 
}

它现在可以在本地正确显示，但是在 Firefox 和 IE 中预览时它仍然不显示。但是，它确实适用于 Chrome。它们是我唯一安装的浏览器。

【问题讨论】：

如果这是您购买的字体，建议您先导入FontSquirrel webfont generator。您使用的语法对我来说似乎不正确。尤其是“font-family”声明。通常字体系列的名称用单引号括起来。

标签： html css fonts font-face

【解决方案1】：

很抱歉将此作为答案发布，但我无法发表评论。您是否允许在字体名称中使用点而不需要引号？如果它有空格或点，我通常会在它周围加上引号，以确保名称与 CSS 一致。试试font-family: 'chopin-script.regular';，看看有什么不同。

【讨论】：