0

我遇到了字体问题,正是“@font-face”。当我尝试运行此本地 HTML 页面时,所有字体都有效,但现在当我尝试运行在线 HTML 页面时,只有一种字体有效。

现在我有两种字体,一种工作,另一种没有

CSS:

@font-face {
    font-family: 'RemachineScript';
    src: url(fonts/SCRIPTIN.ttf);
}

@font-face {
    font-family: 'Quicksand';
    src: url(fonts/Quicksand.otf);
}

header#subheader div.title {
    font-family: 'RemachineScript';
}

header#subheader p.subheader {
    font-family: 'Quicksand';
}

您可以在http://gspinaci.com/上查看 HTML

URL 是正确的,因为它们在同一个文件夹中。我能做些什么?

4

4 回答 4

0

控制台说没有 Quicksand.otf 文件,请确保两件事,第一,该文件存在并且名称完全相同(区分大小写),第二是您的 font-face 调用非常具体,使用可以从字体松鼠下载的 webkit 字体:http: //www.fontsquirrel.com/fonts/Quicksand

并确保将整个 font-face 调用粘贴到您的 CSS 文件中,如下所示:

@font-face {
 font-family: 'triplex';
 src: url('fonts/triplexsans-light-webfont.eot');
src: url('fonts/triplexsans-light-webfont.eot?#iefix') format('embedded-opentype'),
     url('fonts/triplexsans-light-webfont.woff') format('woff'),
     url('fonts/triplexsans-light-webfont.ttf') format('truetype'),
     url('fonts/triplexsans-light-webfont.svg#triplexlight') format('svg');
font-weight: normal;
font-style: normal;
}

请记住包括所有字体格式文件,而不仅仅是 .otf。

编辑

您不需要配置您的服务器,您只需要修改您的 .htaccess 文件,添加以下行:

AddType application/vnd.ms-fontobject eot
AddType font/opentype otf
AddType font/truetype ttf
AddType application/x-font-woff woff
于 2013-05-07T19:35:59.903 回答
0

检查这个答案:@font-face 问题 你接受的答案并不接近防弹;)你也可以试试我的小转换器http://freedockstar.com/fontface/

我也不确定是否需要为字体设置 mime 类型。没有它,它在我的服务器上工作得很好。每种字体都是 text/html 形式的服务器,没有问题。您在 css 中定义类型,并且接缝就足够了;)

于 2013-05-07T22:29:05.243 回答
0

您需要添加:

format (truetype) 或 format (opentype) 或 src 属性后的其他人

@font-face{
   font-family: 'RemachineScript';
   src: url(fonts/SCRIPTIN.ttf) format (truetype);
}

您可以在字体 ttf 文件中找到格式类型

于 2013-10-23T02:21:46.993 回答
0

也许为时已晚,但记录在案......我通过授予 .ttf 文件的读取权限解决了这个问题。

chmod +r font.ttf
于 2015-02-13T23:21:42.977 回答