2

我看过这个:Google Web Fonts don't work in IE8和这个:How to make Google Fonts work in IE? . 都不适合我。第一个建议不要一次导入太多字体,而后者自 2010 年修复该错误以来已过时。

HTML如下:

<!DOCTYPE html>
<html lang="en">
        <head>
                <meta charset="utf-8">
                <title>Font Test</title>
                <meta name="viewport" content="width=device-width, initial-scale=1.0">
                <meta name="description" content="Google Fonts Test">

                <link type='text/css' href='https://fonts.googleapis.com/css?family=Cantarell' rel='stylesheet'>
                <link type='text/css' href='https://fonts.googleapis.com/css?family=Play:700' rel='stylesheet'>
                <link type='text/css' href='https://fonts.googleapis.com/css?family=Muli:300' rel='stylesheet'>
                <!--<link type='text/css' href='//fonts.googleapis.com/css?family=Lato:900' rel='stylesheet'>-->

                <link type="text/css" href="https://static.mysite.com/blah/font-test.css" rel="stylesheet">
        </head>
        <body>
                <div class="page-title">
                        This Is Title
                </div>
                <div class="page-content">
                        This is content
                </div>
        </body>
</html>

这是相应的 CSS:

body {
        height: 100%;
        width: 960px;
        min-height: 550px;
        max-height: 1080px;
        margin: 20px 60px 40px 20px;
        padding-left: 10px;
        padding-right: 10px;

        background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAKklEQVQIW2OceOe1cb6K6FkGJAASYwTxkSVhbLAETBJEw3Tjl8BqFC7LAdSSJR3onNbEAAAAAElFTkSuQmCC) repeat;
}

.page-title {
        height: 55px;
        font: 38px "Play";
}

.page-content {
        font: 16px "Cantarell";
        width: 630px;
        text-align: justify;
}

以上内容在最新的 Chrome 中进行了测试,效果很好。然而,由于某种原因,它在 IE8 中不起作用。有什么我想念的吗?

更新:IE8 根本不适用于 Google Fonts API。事实上,如果我使用 IE8 浏览 Google Fonts API 页面上的许多字体样本,它们都不能正确呈现。使用这些字体的唯一可靠方法是将它们转换为EOT类型(以及WOFF类型),并从您的服务器提供它们,这是一种耻辱,因为您不能再使用 Google 的 CDN。

4

2 回答 2

1

我对其他答案和评论感到困惑,所以我就把它扔在那里。每当您使用数据 uri、属性或集合时,您就是在冒险进入一个 IE 不支持或限制它的领域。只有现代浏览器才能正确处理它们,但我是通过手机执行此操作的,无法进一步了解。结帐http://caniuse.com/#search=data

于 2012-11-23T00:17:29.647 回答
0

某些浏览器上的某些 Google 字体出现问题并不少见,尤其是在远程使用时(Google 推荐的方式)。它通常有助于下载字体,使用例如 FontSquirrel 生成字体文件,然后将它们上传到您的服务器上。

于 2012-11-22T20:51:00.867 回答