Question

   <!DOCTYPE HTML>

<HEAD>
<style type="text/css">

@font-face { font-family: Blah; src: url('../fonts/WillyWonka.ttf'); 

} 

span.header {
font-family: 'palatino linotype', palatino, serif;
font-size: 36px;
font-weight: bold;
font-variant: small-caps;
color: white;
text-decoration:none;
padding: 20pt;
}

span.content {
font-family: 'Blah', arial, serif;
font-size: 36pt;
}




#contacttable {
position:absolute;
left:20%;top:15px;
}

#contacttable td {
position:absolute;
}

</style>

</HEAD>

<BODY bgcolor="black">
<Table id="contacttable">
<tr>
<td>
<span class="header"> Title of Section </span>
<hr />
<br><br><br>
<span class="content"><font color="red">l</font><font 

color="orange">o</font><font color="yellow">w</font>

...

由于某种原因改变字体使它无法正常工作。任何帮助？（来源http://theriverbendstreetbeach.org/nads/misc/showyou.html）

Answer 1

请记住，CSS网址路径是相对于CSS文件的（或者在这种情况下是声明CSS的html）。

通过说url(../fonts/WillyWonka.ttf)您正在指示浏览器从HTML中查找一个目录，然后进入字体文件夹：

http://theriverbendstreetbeach.org/nads/fonts/WillyWonka.ttf

看起来您的字体文件实际位于：

http://theriverbendstreetbeach.org/fonts/WillyWonka.ttf

因此，对于此特定HTML文件，我会将网址路径更改为url(../../fonts/WillyWonka.ttf);

Answer 2

正如Shad在评论中发布的那样，http://theriverbendstreetbeach.org/nads/fonts/WillyWonka.ttf中缺少您的字体。

您可以使用Fiddler等工具轻松调试这些问题：http://www.fiddler2.com/fiddler2/

它是一个代理，向您显示所有请求及其状态代码。 404s显示为漂亮的红色。

为什么这个字体嵌入不起作用？

2 个答案: