使用字体 - 您自己的字体

Question

我正在尝试将自己的字体添加到我的网站我已经检查了很多堆栈流文章，很多似乎是特定于浏览器或路径问题。我似乎无法在任何浏览器上显示我的字体，任何人都知道它是什么？

@font-face {
font-family: "Helvetica";
src: url('http://spawnasite.co.uk/Helvetica-Condensed-Light-Light.ttf') format("truetype");
}

h1{
text-align: center;
text-transform:uppercase;
color:#232323;
font-size: 24px;
font-family: "Helvetica", sans-serif;
}

Js Fiddle http://jsfiddle.net/Gz26Q/

Answer 1

1. 您正在尝试覆盖现有字体，将其命名为myHelvetica
2. 使用其他格式：eot，wot。

请参阅以下链接：

http://blog.themeforest.net/tutorials/how-to-achieve-cross-browser-font-face-support/

http://caniuse.com/ttf

Answer 2

我的猜测是，您引用的字体是受保护的。

并非所有的字体代工厂，特别是像Helvetica这样的代工厂，都允许嵌入他们的字体。他们在字体中有代码来防止这种情况。

您仍然可以在计算机上使用该字体，但不能将其嵌入到未安装该字体的其他应用程序或文档中。

---

提醒人们之前提到的内容：

1. 将自定义字体系列的名称从"Helvetica"更改为其他名称，以避免覆盖默认命名约定。
2. 使用多种类型的字体进行备份。

---

此外，

1. 我高度建议查看FontSquirrel - 某些字体甚至还有自己的webfont工具包预先制作好您开箱即用。
2. 如果您尝试在Chrome中加载字体并希望更好地呈现 - 请确保将SVG放在声明的顶部。有关详细信息，请参阅here。

Answer 3

基本问题很简单：字体资源的URL错误。尝试获取http://spawnasite.co.uk/Helvetica-Condensed-Light-Light.ttf会导致404 Not Found。