Windows 7 中 Chrome 16 上的 @font-face 看起来像是被什么东西吃了一部分
问题
它应该是什么样子(Mac 上的 Chrome 16)。
(来源:ddesign.si)
外观(Windows 7 上的 Chrome 16)
(来源:ddesign.si)
更大的字体看起来如何
(来源:ddesign.si)
描述
我正在使用 Font Squirrel 的生成器来生成我的 css 代码。
font-family: 'Conv_Gotham-Light';
src: url('fonts1/Gotham-Light.eot');
src: local('☺'),
url('fonts1/Gotham-Light.woff') format('woff'),
url('fonts1/Gotham-Light.ttf') format('truetype'),
url('fonts1/Gotham-Light.svg') format('svg');
尝试过的解决方案
我尝试了很多解决方案(替换字体顺序(svg在顶部), <一href="https://support.google.com/chrome/forum/AAAAP1KN0B0oXILHkVG75M/?hl=en&gpf=d/category-topic/chrome/report-a-problem-and-get-troubleshooting-help/oXILHkVG75M" rel="nofollow noreferrer">添加文本阴影, 添加 -webkit-text-lines、-webkit-font-smoothing 等),但没有一个起作用。
需要什么文件?
它在 Windows 7 上的 IE 9 上正常工作。我搜索了 apache 日志,发现 Windows 上的 IE 请求 .woff 文件,但 Windows 7 上的 Chrome 16 请求 .ttf 文件,并且在“svg 修复”请求 .svg 之后和.ttf。
现在怎么办?
那么这是怎么回事?我该如何解决这个问题?
The problem
How it should look (Chrome 16 on a Mac).
(source: ddesign.si)
How it looks (Chrome 16 on Windows 7)
(source: ddesign.si)
How it looks with bigger font-size
(source: ddesign.si)
Description
I'm using Font Squirrel's generator for my css code.
font-family: 'Conv_Gotham-Light';
src: url('fonts1/Gotham-Light.eot');
src: local('☺'),
url('fonts1/Gotham-Light.woff') format('woff'),
url('fonts1/Gotham-Light.ttf') format('truetype'),
url('fonts1/Gotham-Light.svg') format('svg');
Tried solutions
I tried many solutions (replacing font order (svg on top), adding text shadow, adding -webkit-text-stroke, -webkit-font-smoothing, etc.), but none of them worked.
What files are requested?
It works correctly on IE 9 on Windows 7. I've searched through apache logs and found out that IE on Windows requests the .woff file, but Chrome 16 on Windows 7 requests .ttf file and after the "svg fix" requests .svg and .ttf.
What now?
So what is going on and how can I fix this?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
正如已经指出的,这是因为字体缺少提示。不管怎样,Mac OS 总是会删除提示数据,因为它的光栅化器会“自动提示”字体本身。
然而,有一个很棒的小软件,它使用 FreeType 的自动提示并将数据嵌入到文件中,即它自动为您提示字体。
请参阅此处:http://www.freetype.org/ttfautohint/
It's because the font is missing hinting, as already noted. Mac OS always strips away the hinting data anyway, as its rasterizer "auto-hints" the font itself.
However, there is a great little software which uses the automatic hinting of FreeType and embeds the data into the file, i.e. it auto-hints the font for you.
See here: http://www.freetype.org/ttfautohint/
字体缺少提示。当 Windows 中的字体丢失或添加了块时,您通常可以归咎于 TTF 提示。通过 Font Squirrel Generator 运行字体,它应该可以解决您的问题。
The font is missing hinting. When fonts in Windows have chunks missing or added, you can usually blame the TTF hinting. Run the font through the Font Squirrel Generator and it should fix your problem.