css - 无法使 Logo 文本(字体)看起来类似于 firefox 呈现的方式(问题是 Internet Explorer)

Question

我使用 Lobster 字体，在 chrome/firefox/opera/safari 和 internet explorer 中看起来完全不同。

在 IE8, 7 下不可用

您可以在此处查看示例:dev.holiday.ge/xhtml -> 查看 Firefox 与 IE 中的红色 Logo 。

Answer 1

在:dev.holiday.ge/xhtml/all-ie-only.css

你有:

@font-face {
    font-family: 'Lobster';
    src: url('fonts/DroidSans.eot');
}

这应该是这样的:

@font-face {
    font-family: 'Lobster';
    src: url('fonts/Lobster.eot');
    src: url('fonts/Lobster.eot?#iefix') format('embedded-opentype'); /* IE6-IE8 */
}

如果你有.eot

为了获得最佳的字体兼容性，请使用以下语法:

@font-face {
font-family: 'MyWebFont';
src: url('webfont.eot'); /* IE9 Compat Modes */
src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
     url('webfont.woff') format('woff'), /* Modern Browsers */
     url('webfont.ttf')  format('truetype'), /* Safari, Android, iOS */   
     url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */

}