@ font-face不适用于Chrome，Firefox，IE

这是我的CSS代码：@ font-face不适用于Chrome，Firefox，IE

字体无法正常工作。我错过了什么？

我想提一提，它不是在本地安装操作系统的，我敢肯定的URL转到字体正好

@font-face { 
    font-family: 'ma'; 
    src: url('http://localhost/header/images/FS_Old.ttf'); 
} 

.menu_head { 
    width: 100%; 
    position: relative; 
    height: 30px; 
    font-family: 'ma'; 
}

来源

2013-03-25 Majed DH

Localhost将成为问题，请检查Chrome Error Console并查看错误是什么。 – 2013-03-25 14:49:18

你检查过所有的浏览器吗？ – Eli 2013-03-25 14:53:09

那个控制台在哪里？ – 2013-03-25 14:53:24

瑞安是正确的。我用一个工作网址替换了您的网址，并且它工作得很好。这是我用过的。

@font-face { 
    font-family: 'ma'; 
    src: url('http://www.cse.buffalo.edu/~rsd7/BaroqueScript.ttf'); 
} 


.menu_head { 
    width: 100%; 
    position: relative; 
    height: 30px; 
    font-family: 'ma'; 
}

来源

2013-03-25 15:09:46

现在的大问题，没办法使一个字体在Firefox上工作！ – 2013-03-25 15:20:53

检出：http://stackoverflow.com/questions/11616306/css-font-face-absolute-url-from-external-domain-fonts-not-loading-in-firefox你将需要在你的服务器上实现如果您从其他服务器引用的字体不是您自己的/ – 2013-03-25 15:38:54

如果这是被接受的答案，那么真正的问题与实际要求的不同。 – 2013-03-25 21:11:31

应该可能是因为Chrome浏览器，火狐，IE不支持ttf扩展。你可以尝试把其他扩展：

@font-face { 
    font-family: 'ma'; 
    src: url('FS_Old.eot'); /* IE9 Compat Modes */ 
    src: url('FS_Old.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ 
     url('FS_Old.ttf.woff') format('woff'), /* Modern Browsers */ 
     url('FS_Old.ttf.ttf') format('truetype'), /* Safari, Android, iOS */ 
}

来源

2013-03-25 15:10:49 Eli

我用这个网站的字体转换为其他类型的http://www.fontsquirrel.com/tools/webfont-generator，并使用了不同的支持的字体类型，并且似乎已经解决了这个问题。这里是适用于所有浏览器的新代码。

<html> 
<head> 
<style> 


    @font-face { 
    font-family: 'baroque_scriptregular'; 
    src: url('baroquescript.eot'); 
    src: url('baroquescript.eot?#iefix') format('embedded-opentype'), 
     url('baroquescript.woff') format('woff'), 
     url('baroquescript.ttf') format('truetype'), 
     url('baroquescript.svg#baroque_scriptregular') format('svg'); 
    font-weight: normal; 
    font-style: normal; 

} 

    .menu_head { 
     width: 100%; 
     position: relative; 
     height: 30px; 
     font-family: baroque_scriptregular; 
    } 
</style> 
</head> 
<body> 
<div class="menu_head" > 

    hellod 
    </div> 
</body>

来源

2013-03-25 15:55:33

@ font-face不适用于Chrome，Firefox，IE

回答

相关问题