0

我的 css 文件中有以下代码。字体在 Mac OS 上的所有浏览器中都按需要呈现，但不会在 Windows 上呈现。现在在你说它不兼容 Windows 之前，我已经在 Windows 机器上创建了一个虚拟页面，它可以在 Chrome（不是 IE）中正常运行“.woff”文件。Hover IE 可以渲染这个页面。我觉得我在@font-face 中遗漏了一些重要的东西。这是我的代码：

@font-face { font-family: Skia; 
        src:url('./webfonts/skia.ttf') format('truetype'),
            url('./webfonts/skia.eot') format('embedded-opentype'),
            url('./webfonts/skia.woff') format('woff'),
            url('./webfonts/skia.svg');
        font-weight: lighter;
        font-style: normal;
    }

“webfonts”文件夹与 css 文件所在的“styles”文件夹位于同一目录中。

>styles
    >'style.css'
>webfonts
    >'skia.ttf / woff / eot / svg'

在<body>标签中，我包括font-family:Skia, sans-serif;

4

1 回答 1

-1

看起来你在正确的轨道上

@font-face {
    font-family: "sansation";
        src: url("fonts/sansation_light.eot");
        src: url("fonts/sansation_light.eot?#iefix") format("eot"),
             url("fonts/sansation_light.ttf") format("truetype"), 
             url("fonts/sansation_light.woff") format("woff"), 
             url("fonts/sansation_light.svg") format("svg");
    font-weight: 200;
    font-style: normal;
}

您确实希望包含格式，即针对旧版本的 ie 的修复，针对歌剧的 woff 和针对移动设备的 svg。这种格式通常不会让我出错！

此外，您可以放心地省略 ./，因为它与当前目录有关。您还应该包括font-weightand font-style。查看 google webfonts 是如何做到这一点的。

于 2013-03-22T18:33:00.637 回答