@font-face修复了ie9及以上版本，但在ie8中引入了新问题

Question

大家好，

最初，我有一个font-face，它在所有浏览器中工作良好，除了IE 9及以上:

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

为了解决这个问题，我添加了另一个font-face:

/* To fix IE 9 and above bold issue */
@font-face {
    font-family: 'dax-regularregular';
    src: url('../fonts/daxbold-webfont.eot');
    src: url('../fonts/daxbold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/daxbold-webfont.woff') format('woff'), 
         url('../fonts/daxbold-webfont.ttf') format('truetype'),
         url('../fonts/daxbold-webfont.svg#dax-regularregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

这解决了我在ie9及以上版本中的问题，然而，它在ie8中引入了新的问题。也就是说，正常的单词会被加粗，加粗的单词会变得"更粗"(变得更胖)。我从网上看到ie8不支持WOFF格式的@font-face规则(只支持EOT格式)。所以，我把除了eot以外的url都拿出来了，但还是遇到了问题。

我改变我的css代码如下，但仍然相同的命中问题在IE 8:

@font-face {
    font-family: 'dax-regularregular';
    src: url('../fonts/daxbold-webfont.eot');
    src: url('../fonts/daxbold-webfont.eot?#iefix') format('embedded-opentype');
    font-weight: normal;
    font-style: bold;
}

我最初的问题是font-family崩溃与@font-face src

请建议。

Answer 1

试试这个:

@font-face {
    font-family: 'MyFontFamily';
    src: url('myfont-webfont.eot?#iefix') format('embedded-opentype'), 
        url('myfont-webfont.woff') format('woff'), 
        url('myfont-webfont.ttf')  format('truetype'),
        url('myfont-webfont.svg#svgFontName') format('svg');
}