在带有 Chrome 的 Windows 8 上,大文本字体不流畅。但是,我设法看到了一些文本流畅的网站(相同的环境)。
首先:http: //twitter.github.com/bootstrap/examples/hero.html
“你好,世界!” 是平滑的,但是底部的“标题”文本并不像您所看到的那样平滑,即使它们更小。
另一个是http://www.asana.com。在他们的主页上,“做伟大的事情”的文字很流畅。
现在两个页面都使用 Twitter Bootstrap CSS。
当我在 Chrome 开发者工具上查看相关 html 元素的计算样式时,我看到了这些值:
background-color: transparent;
border-bottom-left-radius: 0px;
border-bottom-right-radius: 0px;
border-top-left-radius: 0px;
border-top-right-radius: 0px;
color: #333;
display: block;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 60px;
font-weight: bold;
height: 60px;
letter-spacing: -1px;
line-height: 60px;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
margin-top: 10px;
padding-bottom: 0px;
padding-left: 0px;
padding-right: 0px;
padding-top: 0px;
text-rendering: optimizelegibility;
width: 1050px;
我看到 Asana 使用了一种名为 proxima-nova-condensed 的字体,但是当我使用它时,它对我来说并不流畅,即使使用文本渲染:optimizelegibility。
你知道他们是如何实现的吗?我想了解如何在没有 Twitter Bootstrap 的情况下(或者如果必须的话,使用 Bootstrap)来做到这一点。