无法在网站上加载自定义字体

Question

我正在使用@font-face 尝试在我的网站上加载自定义字体，至少在 google chrome.

不过，我很难做到...有人可以帮忙吗？

<style type="text/css">
@font-face {
  font-family: Folks;
  url(http://www.vtxfactory.com/Folks-Normal.ttf) format('truetype'),
}
body {
  background-color: #000000;
  text-align: center;
  color: #FFF;
  font-family: Folks;
}
</style>

字体名称是 "Folks" 但我只使用 "Folks-Normal" 因为我不使用粗体版本。字体已在定向 url 源上分配。

你可以在http://www.vtxfactory.com/上看到，当你进入时，font-family 变成了 Times New Roman 并且没有加载我的自定义字体。

此致，瑞·法里尼亚.

Answer 1

将 CSS 中的 url 更改为路径

@font-face {
font-family: Folks;
src: url(/path/to/your/font/file/Folks-Normal.ttf) format('truetype'),
}

你也可以使用这项服务 http://www.font2web.com/

Answer 2

我想你错过了必需的 src 属性和末尾的分号：

@font-face {
  font-family: Folks;
  src: url('http://www.vtxfactory.com/Folks-Normal.ttf') format('truetype'); //<-- semicolon
}

无法在网站上加载自定义字体

Can't load custom font on website

css

fonts

font-face

web