Web Safe字体权重 - 如何变薄？

Question

当我在Photoshop设计,我的字体是薄而脆,但是当我在CSS中声明的字体 - 即使使用的字体重量:轻 - 字体总是出现大胆.

也许这就是浏览器是如何呈现的字体(在IE浏览器的字体保持身材苗条),但我不知道是否有达到同样薄,脆长相任何技巧或提示.

Answer 1

使用CSS来平滑你的字体......

把它放在你的CSS中:

-webkit-font-smoothing: antialiased;

Answer 2

字体渲染可能很复杂.不幸的是,不同的浏览器会以不同的方式呈现相同

就CSS而言,设置font-weight:100可确保使用最轻的可用重量.您可能还想设置-webkit-font-smoothing:antialiased.

<style type="text/css">
   body {
      font-family:"Helvetica Neue", Arial, sans-serif;
      font-weight:100;
      -webkit-font-smoothing:antialiased;
   }
</style>

Helvetica Neue是OSX原生的非常薄的字体.

你最好的选择是http://www.google.com/fonts/

另外值得注意的是:
https://typekit.com/
http://www.fontsquirrel.com/tools/webfont-generator

Answer 3

你是对的，这是渲染上的差异。文本的呈现方式取决于您的操作系统、设置和浏览器（例如，Safari 的呈现方式比 IE 更粗）。所以没有办法让这个渲染与你的 Photoshop 合成相匹配。

这里有更多信息：

浏览器选择与字体渲染 | 菲尼字体