OS之间具有不同垂直度量的自定义字体

Question

我正在尝试为我正在构建的页面添加自定义字体.我的问题是我的ubuntu开发机器和windows pc上的字体垂直对齐看起来不同.

首先,这是了解问题的图像

编辑:遗憾的是作为新用户我无法发布图片,所以这里有一个描述:

问题是字体基线与其下方元素之间的距离.在我的ubuntu机器上有一个无法解释的差距,它不是填充/边距.即使您选择文本,它看起来也不对齐.

两者都在Chrome上测试,当然在它后面的html/css相同(它是同一页面).在代码和chrome的检查器工具上没有底部边距/填充.相同的行高.字体是Museo.两者都加载.woff版本的字体.任何其他信息,我很乐意提供.

导入字体的CSS是:

@font-face {
  font-family: 'Museo-700';
  src: url('path-to-eot');
  src: url('path-to-eot?') format('embedded-opentype'),
       url('path-to-woff') format('woff'),
       url('path-to-ttf') format('truetype');  
}

即使我删除了woff声明并且ttf提供了字体,问题仍然存在.

我真的迷失了,不知道我怎么能这样做.

Answer 1

字体有三组嵌入式垂直度量信息.一套用于Mac,一套用于PC,另一套用于*nix.这些可能很难同步,但我们的Font-face Generator确实尝试使这些值相同.试试看？

http://www.fontsquirrel.com/fontface/generator

来自Google类型团队的更多信息:

http://code.google.com/p/googlefontdirectory/wiki/VerticalMetricsRecommendations