Question

这是我的herokuapp：https://majeddh.herokuapp.com;我现在用它来测试字体。

这是我的HTML代码：

<?php echo 'majed'?><html>
<script src="http://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js"></script>

<style>
    @import url('lateef.css');

    h1 {
        font-family: 'Lateef';
    }

    .wf-active h1 {
        visibility: visible;
    }
    h2{
    font-family:'lateef1';}
</style>

<body>
<h1>This headline will be hidden until Droid Sans is completely loaded.</h1>
<h1>ماجد</h1>
<h2>This headline will be hidden until Droid Sans is completely loaded.</h2>
<h2>ماجد</h2>
</body>
</html>

这是CSS：

@font-face {
      /*this is arabic*/
  font-family: 'Lateef';
  font-style: normal;
  font-weight: 400;
  src: url(https://majeddh.herokuapp.com/FS_Metal2.TTF) format('truetype');
}
@font-face {
       /*this is english*/
  font-family: 'Lateef1';
  font-style: normal;
  font-weight: 400;
  src: url(https://majeddh.herokuapp.com/FS_Metal1.ttf) format('truetype');
}

我不知道问题出在哪里;英语字体出现但阿拉伯语没有出现，我尝试了3种不同的字体，出现了同样的问题。

Answer 1

Answer 2

当我使用Firefox访问您的页面时，Firebug控制台会说：

“NetworkError：404 Not Found - https://majeddh.herokuapp.com/FS_Metal2.ttf”

这似乎解释了一切 - 缺少字体文件（在服务器上）。

浏览器无法正确显示阿拉伯字体

2 个答案: