html - 优化文本渲染 - CSS

Question

导航栏上的文本呈现非常糟糕，至少在 Yosemite 的 Safari 和 Firefox 上是这样。文字没有显示它的曲线，但更厚更不完美。

如果我放大网页，它会有所改善，如果我强制将焦点放在任何元素上也是如此。

如果它总是有规律的，我不会太在意这个，但问题在于焦点。页面似乎设计得不太好，我一点也不喜欢那种印象。我正在使用带有 Ubuntu 排版的 Bootstrap 框架。这发生在 font-weight:500 处。

示例 http://www.bootply.com/Ptp4gXpHAF .只需点击搜索栏。

这是我想要的和呈现的之间的区别:

由于上传分辨率，图像显示模糊，但我认为有很大差异。

Answer 1

我刚刚将字体粗细更改为 300。也许 safari 试图渲染更高的字体粗细，但是当我点击它时，字体粗细属性被覆盖了。在将其设置为 300 时，它工作得很好。