字体在我的页面上不起作用

Question

我不知道为什么我的字体没有被应用。

我正在尝试为类 font1、font2、font3 应用“Kenyancoffee”字体。

这是我的 HTML 代码：

<content>
    <div class="font1">
         <p>Text to show up</p>
    </div>
</content>

</article>

<article class="middlecontent"> 
    <header>
        <h2>
            <a href="#" rel="bookmark" title="Permalink to this POST TITLE">Our Product</a>
        </h2>
    </header>

    <content>
         <div class="font2">
             <p>Text to show up</p>
         </div>
    </content>

</article>

<article class="bottomcontent">
    <header>
        <h2>
            <a href="#" rel="bookmark" title="Permalink to this POST TITLE">Contact Us</a>
        </h2>
    </header>


    <content>
         <div class="font3">
             <p>Text to show up</p>
         </div>
    </content>

    <style>

        @font-face {
            font-family: KenyanCoffeeRg-Regular; 
            src: url(Madmonkey/kenyancoffee.ttf);
        }    

        .font1, .font2, .font3 {
            font-family: KenyanCoffeeRg-Regular;  
        }

   </style>

找错了几个小时。谢谢你的回答。

Answer 1

如果你想使用 kenyan coffe 字体，请从这里下载 zip

http://www.dafont.com/kenyan-coffee.font

并按照 zip 中包含的文本文件中给出的说明进行操作

Answer 2

代码看起来不错，字体网址可以吗？可能是这样。 尝试检查元素并查看路径是否正确。

src: url(Madmonkey/kenyancoffee.ttf);

编辑 2： 在 HTML 中是 ID，所以 #font1，而不是 .font2（. 代表类名，# 代表 ID） 试试这个看看效果如何。

  @font-face {
  font-family: 'KenyanCoffeeRg-Regular'; 
  src: url(Madmonkey/kenyancoffee.ttf);
}


     #font1, #font2, #font3 {
      font-family: 'KenyanCoffeeRg-Regular';  
 }