Question

我正在使用@ font-face来定义我自己的字体：

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

@font-face{ 
    font-family: HelveticaNeue;
    src: url('fonts/helvlight_bold-webfont.eot');
    src: local("☺");
    src: url('fonts/helvlight_bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/helvlight_bold-webfont.woff') format('woff'),
         url('fonts/helvetica_bold-webfont.ttf') format('truetype'),
         url('fonts/helvlight_bold-webfont.svg#webfont') format('svg');
    font-weight: bold;
    font-style: normal;
}

在Font Squirrel上生成了font-face规则，之后我添加了font-weight和font-style规则。我在CSS中使用我的自定义字体：

body {
    font: 16px HelveticaNeue, Verdana, sans-serif;
    color: black;
}

h1 {
    font-weight: bold;
    font-size: 2em;
}

它在Chrome，Firefox，Opera和Safari中运行良好，但在Internet Explorer中无效。

我试过这个@font-face works in IE8 but not IE9没有成功。

我还尝试将粗体样式的font-face名称更改为HelveticaNeueBold并将其用作：

h1 {
    font-family: HelveticaNeueBold;
    font-size: 2em;
}

它有效，但这不是我想要的。在加粗之后添加！重要没有帮助。有什么建议我做错了吗？

Answer 1

IE不支持使用与font-weight规则中指定的@font-face不同的{{1}}。

您可以在此处详细了解：@font-face IE9 font-weight doesn't work

font-weight：粗体，@ font-face在IE9中不起作用

1 个答案: