Question

我不确定我是否在浏览Chrome中的错误或我的CSS出了什么问题

以下是我所说的内容的演示：demo link

问题是我在我的网站中使用了一个名为BMitra的自定义Farsi字体（它在公共领域是完全免费的）和所有主流浏览器（最新的FF和IE6 + ）正在渲染此字体，但我的Chrome会跳过此字体并切换到系统的默认tahoma。

这是我的CSS：

@font-face {
    font-family: 'BMitra';
    font-weight: normal;
    src: url('fonts/regular/BMitra.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('fonts/regular/BMitra.woff') format('woff'), /* Modern Browsers */
         url('fonts/regular/BMitra.ttf')  format('truetype'), /* Safari, Android, iOS */
         url('fonts/regular/BMitra.svg#svgBMitra') format('svg'); /* Legacy iOS */
    }

@font-face {
    font-family: 'BMitra';
    font-weight: bold;
    src: url('fonts/bold/BMitraBd.woff') format('woff'), /* Modern Browsers */
         url('fonts/bold/BMitraBd.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('fonts/bold/BMitraBd.ttf')  format('truetype'), /* Safari, Android, iOS */
         url('fonts/bold/BMitraBd.svg#svgBMitra') format('svg'); /* Legacy iOS */
    }

那么，有什么想法吗？这是webkit或其他方面的错误。提前致谢。

<小时/> 的 侧面说明：

原始字体采用真实格式，我使用在线工具进行转换。但我确信字体没有损坏，因为所有其他格式都正常工作。
我刚刚发现有人遇到了同样的问题（here is the link），但解决方案根本不起作用！它还打破了IE9中的功能！
我可以看到Chrome在Chrome控制台中加载字体，因此问题不在于网页服务器或网页加载时字体资源不可用。

Answer 1

这不是一个错误。您的字体不是标准的，并且它在Firefox 11中也无法正常工作（它显示了彼此分开的字符，这是坏字体的标志）。您可以在此处找到适用于Web的新系列波斯字体。这些字体对新版浏览器没有任何问题：http://www.scict.ir/Portal

Answer 2

我已在您的问题中转换了上述字体，并将其上传到以下互联网地址：

bMitra Web Font Package

bMitraBd Web Font Package

此外，您必须使用以下样式行：

@font-face {
    font-family: 'BMitra';
    src: url('fonts/regular/bmitra-webfont.eot');
    src: url('fonts/regular/bmitra-webfont.ttf') format('truetype'), url('fonts/regular/bmitra-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/regular/bmitra-webfont.woff') format('woff'), url('fonts/regular/bmitra-webfont.svg#BMitra') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'BMitra';
    src: url('fonts/bold/bmitrabd-webfont.eot');
    src: url('fonts/bold/bmitrabd-webfont.ttf') format('truetype'), url('fonts/bold/bmitrabd-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/bold/bmitrabd-webfont.woff') format('woff'), url('fonts/bold/bmitrabd-webfont.svg#BMitra') format('svg');
    font-weight: bold;
    font-style: normal;
}

并且，您应该在 .htaccess 文件中添加以下行：

AddType application/vnd.ms-fontobject .eot
AddType font/ttf .ttf
AddType font/otf .otf
AddType application/x-font-woff .woff

Persian @ font-face在Chrome中不起作用，不管是不是Bug？

2 个答案: