Css IE8字体回退中使用的Webfonts

我目前正试图在我构建的网站上实现webfonts，我想在font family属性中使用它作为备用项，即，如果字符未在Arial/Helvetica中表示，那么它应该在使用的webfont中

我意识到这在IE6和IE7中不起作用，但我希望它在IE8中起作用，而IE8似乎不太起作用

我只是想知道是否有人曾经遇到过这个问题，在IE8中是否可以使用webfont作为备用字体，或者是否有人可以看到我只是在代码中做了一些错误的事情

提前谢谢你的帮助

以下是我的css代码：

@font-face {
    font-family: 'stix';
    src: url('/webfonts/webfont.eot');
    src: local('☺'), url('/webfonts/webfont.woff') format('woff'), url('/webfonts/webfont.ttf') format('truetype'), url('/webfonts/webfont.svg#webfont3hGwcDt1') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'stix';
    src: url('/webfonts/bold-webfont.eot');
    src: local('☺'), url('/webfonts/bold-webfont.woff') format('woff'), url('/webfonts/bold-webfont.ttf') format('truetype'), url('/webfonts/bold-webfont.svg#webfontJse4ZhT8') format('svg');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'stix';
    src: url('/webfonts/talic-webfont.eot');
    src: local('☺'), url('/webfonts/italic-webfont.woff') format('woff'), url('/webfonts/italic-webfont.ttf') format('truetype'), url('/webfonts/italic-webfont.svg#webfonthDLBqRGk') format('svg');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'stix';
    src: url('/webfonts/bold_italic-webfont.eot');
    src: local('☺'), url('/webfonts/bold_italic-webfont.woff') format('woff'), url('/webfonts/bold_italic-webfont.ttf') format('truetype'), url('/webfonts/bold_italic-webfont.svg#webfontnuMlJc7x') format('svg');
    font-weight: bold;
    font-style: italic;

}

body { font-family: arial, helvetica, clean, stix, sans-serif}
body.ie6 #content, body.ie6 .popup { font: 15px/1.6em stix; }

---

尝试在

上使用converter使用STIX作为备用方案有什么好处

如果是为了防止UA下载字体，除非需要，那你就倒霉了，目前只有webkit的行为更糟糕，IE将下载@font-face中定义的所有字体，即使它们在CSS中没有被引用

如果是因为斯蒂克斯没有固定的角色，是的，我会把你弄到这里来。我建议将STIX与免费字体合并，以创建一个具有所有所需字符的可交付成果。

问题可能是“在Internet Explorer 8和早期版本中”

---

另外，不要使用@font-face作为后置字体，选择一种您喜欢的字体，不要声明“arial，helvetica”的顺序，而是直接使用无衬线字体。这样，每个平台上都会使用最合适的sans serif，例如Arial for Windows和Helvetica for OS X等。

我使用的是精简版的代码（仅为了清晰起见，没有任何问题），并在许多浏览器中进行测试（webfont是STIX，与您一样，我不知道这是否起到了作用），我看到了一些奇怪的行为：大多数浏览器中的字体回退确实有效，但只有在排除所有斜体字体变体（无论是斜体还是粗体斜体）时才有效

也就是说，这是可行的（100%的时间），对于那些不在arial中的字符，浏览器会退回到STIX：

@font-face {
    font-family: 'stix';
    src: url('stixgeneral-webfont.eot');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'stix';
    src: url('stixgeneralbol-webfont.eot');
    font-weight: bold;
    font-style: normal;
}
body {font-family: arial, stix, sans-serif;}

…但这不会在100%的时间内起作用（尽管有时它会显示字符！）：

出现这种情况的原因似乎是STIX字体包有错误

---

为了解决这个问题，打开FontForge中的STIX字体包，save-FontForge将通知您错误。修复这些问题，然后导入FontSquirrel。字体回退现在应该可以正常工作。

顺便说一句。。。IE将尝试加载SVG格式，因此您应该在SVG之后定义EOT src！（即bug）。

感谢您的回复。它最初是使用fontsquirrel.com创建的，所以这不是问题所在。理想情况下，STIX的使用应该限制在较小的范围内。一些JS可以查看它，并在非mathsy unicode范围内对字符进行arial-ize。这段代码只在IE中才需要，而回退将是该跨度的所有STIX。另一个建议。。。尝试将arial作为后备方案，而不是STIX。从STIX中删除常规字符，然后查看IE是否返回默认值。我很确定IE8在网络字体方面会倒退（我以为只有IE6没有）排版，也许会有所不同：/webfonts/talic-webfont.eot->/webfonts/italic-webfont.eot当作为主要字体而不是后备字体时，它是否正确应用了所有变体字体？

@font-face {
    font-family: 'stix';
    src: url('stixgeneral-webfont.eot');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'stix';
    src: url('stixgeneralitalic-webfont.eot'); /* note - italic font variant */
    font-weight: normal;
    font-style: italic;
}
body {font-family: arial, stix, sans-serif;}