Question

我有一个/css的CSS文件和/images中的字体。我的CSS代码使用@font-face，它适用于IE8，IE9和所有体面的浏览器，但显然不适用于IE7。

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

h1, h2, h3 {
    font-family: ChunkFiveRegular, Georgia, serif;
    font-weight: normal;
    text-transform: uppercase;
}

为什么文字仍然显示为格鲁吉亚？

Answer 1

如果您的字体位于/images，则需要使用/images，而不是/image。也就是说，你的字体属于/css;字体不是图像。

此外，根据Paul Irish's article，'eot'的效果应优于'embedded-opentype'（未经测试）。

Answer 2

http://www.thecssninja.com/demo/css_fontface/

@font-face {
font-family:InYourFace;
src: url('Ubuntu-B.eot');
// this smile and ? fix your problem
// because IE don't wanl load local font without this hack
src: url('Ubuntu-B.eot?') format('☺'),  
    url('Ubuntu-B.woff') format('woff'),
    url('Ubuntu-B.ttf') format('truetype'),
    url('Ubuntu-B.svg#webfontssbCkuz5') format('svg');
}

@ font-face在IE7中不起作用

2 个答案: