Question

我正在尝试导入CSS字体，但不幸的是它无法正常工作，我真的不确定原因。

文件系统中名为'deadjim.ttf'的字体它放在我的主public_html里面，是的，它是正确的路径，访问路径下载文件。

@font-face {
    font-family: 'deadjim';
    src: url('http://url.com/deadjim.ttf'); /*URL to font*/
}

我已经尝试清除缓存，但这也没有用。显然它正在使用Safari，但我无法检查是否有Windows PC

Answer 1

确保您正常调用字体; @ font-face不对html应用任何样式，它只定义字体。

#Define your font
@font-face {
  font-family: 'deadjim';
  src: url('http://url.com/deadjim.ttf'); /*URL to font*/
}

#Will apply the font as default on the entire page
html, body{
  font-family: 'deadjim';
}

Answer 2

为确保您的字体适用于所有浏览器/大多数平台，您需要执行与此类似的操作（提供所有格式） - 仅仅拥有.ttf文件是不够的。

以下是包含FontAwesome的示例：

@font-face {
  font-family: 'fontawesome';
  src: url('fontawesome-webfont.eot?v=4.7.0');
  src: url('fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'),
       url('fontawesome-webfont.woff2?v=4.7.0') format('woff2'),
       url('fontawesome-webfont.woff?v=4.7.0') format('woff'), 
       url('fontawesome-webfont.ttf?v=4.7.0') format('truetype'), 
       url('fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

CSS Font-face无效

2 个答案: