@字体面IE9字体重量不工作(@font-face IE9 font-weight doesn

I'ver试图嵌入与CSS @字体面的字体。 我想用它作为一个大胆的字体。 但IE 9不显示字体粗体。

CSS

@font-face {
    font-family: Dauphin;
    src: url('dauphin.woff'),
         url('dauphin.ttf'),
         url('dauphin.eot'),
         url('dauphin.svg')
     ; /* IE9 */
     font-weight: normal;
}
.p {
     font-family: Dauphin;
     font-weight: 900;
}

Answer 1:

IE不支持使用不同的font-weight比在指定@font-face规则。

用于每个字体变形一套字体文件

通常情况下，嵌入字体文件包含只有一个重量和一个风格版本的字体。 当需要多个字体变体，一组不同的嵌入的字体文件被用于每种字体的变体。 在下面的例子中，只有.woff使用的格式，以简化的东西。 在实践中， .eot ， .ttf和.svg通常会被使用。

@font-face {
    font-family: 'myFont';
    src: url('myFont.woff');
    font-weight: normal;
}
@font-face {
    font-family: 'myFont';
    src: url('myFontBold.woff');
    font-weight: bold;
}
...
p {
    font-family: myFont;
    font-weight: normal;
}
h2 {
    font-family: myFont;
    font-weight: bold;
}

支持IE8

然而，IE8具有显示问题当超过1克重量，或4个以上的配重或样式，与字体家庭相关联。 为了支持IE8，使用不同的字体家族每个字体变化。

@font-face {
    font-family: 'myFont';
    src: url('myFont.woff');
}
@font-face {
    font-family: 'myFont-bold';
    src: url('myFontBold.woff');
}
...
p {
    font-family: myFont;
}
h2 {
    font-family: myFont-bold;
}

最大的跨浏览器支持

对于跨浏览器支持的最佳量，可使用以下语法：

@font-face {
    font-family: 'myFont';
    src: url('myFont.eot');
    src: url('myFont.eot?#iefix')
             format('embedded-opentype'),
         url('myFont.woff') format('woff'),
         url('myFont.ttf') format('truetype'),
         url('myFont.svg#svgFontName') format('svg');
}
@font-face {
    font-family: 'myFont-bold';
    src: url('myFontBold.eot');
    src: url('myFontBold.eot?#iefix')
             format('embedded-opentype'),
         url('myFontBold.woff') format('woff'),
         url('myFontBold.ttf') format('truetype'),
         url('myFontBold.svg#svgFontName') format('svg');
}
...
p {
    font-family: myFont;
}
h2 {
    font-family: myFont-bold;
}

文章来源: @font-face IE9 font-weight doesn't work