Chrome浏览器没有阅读我所有的@ font-faces [英] Chrome not reading all my @font-faces

问题描述

我的页面使用了不同的字体。在我的CSS文件中使用的代码如下所示：

  @ font-face {
 font-family： DST; 
 src：url（'fonts / dastnevis.ttf'），
 url（'fonts / dastnevis.eot'），
 url（'fonts / dastnevis.otf'）; 
} 
 
 @ font-face {
 font-family：hayat; 
 src：url（'fonts / hayat.ttf'），
 url（'fonts / hayat.eot'），
 url（'fonts / hayat.otf'）; 
} 
 
 @ font-face {
 font-family：taha; 
 src：url（'fonts / taha.ttf'），
 url（'fonts / taha.eot'），
 url（'fonts / taha.otf'）; Chrome浏览器（我使用的版本是28）只能读取（
）
  

这三种字体之一，这是dst，不显示其他。我使用dst作为按钮，hayat用于页脚，taha用于body。编辑：Firefox阅读并显示所有没有问题的内容。这并不是说Chrome根本不能读取任何字体，它只是读取一种字体而忽略其他字体，尽管它们都有相同的语法。

解析方案

可以帮助你：

  @ font-face {
 font-family：' DST; 
 src：url（'fonts / dastnevis.eot'）; / * IE9兼容模式* / 
 src：url（'fonts / dastnevis.eot？#iefix'）; / * IE6-IE8 * / 
 url（'fonts / dastnevis.woff'）格式（'woff'），/ *现代浏览器* / 
 src：local（'☺'），url（' （'truetype'），/ * Safari，Android，iOS * / url（'fonts / dastnevis.svg'）format（'svg'）; 
 font-weight：normal！important; 
 font-style：normal！important; 
} 
  

I'm using different fonts for my page. Codes I've used in my CSS file are as followed:

@font-face{
font-family:dst;
src:url('fonts/dastnevis.ttf'),
    url('fonts/dastnevis.eot'),
    url('fonts/dastnevis.otf');
}

@font-face{
font-family:hayat;
src:url('fonts/hayat.ttf'),
    url('fonts/hayat.eot'),
    url('fonts/hayat.otf');
}

@font-face{
font-family:taha;
src:url('fonts/taha.ttf'),
    url('fonts/taha.eot'),
    url('fonts/taha.otf');
}

The problem is that Chrome (I'm using version 28) is reading only one of these 3 fonts, which is dst, not showing others. I'm using dst for a button, hayat for footer, and taha for body.

EDIT: Firefox is reading and showing all those with no problem. It's not that Chrome can't read any font at all, it's that it reads one font and ignores the others, though they all have the same syntax.

解决方案

may this help u:

@font-face {
    font-family: 'dst';
    src: url('fonts/dastnevis.eot');/* IE9 Compat Modes */
    src: url('fonts/dastnevis.eot?#iefix'); /* IE6-IE8 */
    url('fonts/dastnevis.woff') format('woff'), /* Modern Browsers */
    src: local('☺'),  url('fonts/dastnevis.ttf') format('truetype'), /* Safari, Android, iOS */ url('fonts/dastnevis.svg') format('svg');
    font-weight: normal !important;
    font-style: normal !important;
}

这篇关于Chrome浏览器没有阅读我所有的@ font-faces的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！