css - Mac Chrome 中的字体渲染错误,导致深色背景上的浅色(灰底白字)

标签 css google-chrome font-face

我正在使用 Folio Condensed Light 字体构建网站。我从 MyFonts 购买了字体并下载了 font-face 工具包。 在
上遇到了一个糟糕的渲染问题 Mac Maverix/Chrome 版本 35.0.1916.114

奇怪的是,该字体在浅色背景上使用深色时工作正常:
enter image description here

但是当浅色在深色背景上时,它是非常糟糕的。
我尝试了所有 css 技巧,但没有任何效果(webkit-font-smooting、text-stroke,...)。 我觉得卡住了!
任何想法将不胜感激!

渲染:
Chrome VS Firefox VS Safari
enter image description here

这是查看我的网站的链接:
http://www.lelevateurdecompetences.com/certifications-qualifications

已添加

text-rendering: optimizelegibility;

但并不是真的更好。
enter image description here

最佳答案

您尚未在 FolioCon-Lig 上设置字体粗细或字体样式,这可能会影响渲染,但在您这样做之前,我建议您阅读以下内容:http://www.fontspring.com/support/installing_webfonts/style-linking

这是处理@font-face 字体粗细和样式的最佳实践方法。

关于css - Mac Chrome 中的字体渲染错误,导致深色背景上的浅色(灰底白字),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24129243/

相关文章:

Safari 和 Chrome 中的 CSS 菜单问题。除非你真的很快,否则子菜单会在悬停时消失!

google-chrome - 如何禁用(变灰)Chrome 扩展的页面操作?

css - @font-face 不适用于任何浏览器

css - 扩展纯 css 网格以具有装订线的最佳方法

html - 单击按钮后显示的空白区域

javascript - 打开信封动画html5或jquery

html - 使用 CSS 边框的三 Angular 形和倒三 Angular 形

css -::在浏览器中选择背景颜色和颜色渲染

html - Firefox 中的自定义字体

html - CSS3 自定义 Font Face 在 html View 中无法正常工作