相关疑难解决方法(0)

经过几个小时的调试和徘徊,我发现不可能在浏览器中一致地垂直对齐具有较差垂直度量的字体.如果一个字体的垂直度量指标很差,它可能会被渲染得太远或太远而且看起来很糟糕,特别是在按钮内部.单独使用css无法解决这个问题.

您可以使用本网站上的测试来检查字体的垂直度量标准:http://levien.com/webfonts/vmtx/(只需下载测试并替换字体.)

这是我得到的结果.上面的一个指标很差,下面的指标正确:(两者都有固定的行高)

Fontsquirrel在专家模式下为其生成器中的不良垂直度量提供修复.不幸的是,我必须使用的字体属于微软(SegoePrint),并被列入Fontsquirrel的黑名单中.

更新:

为了使问题更清楚......这就是我现在面临的情况:

我正在尝试将按钮的文本垂直对齐到中间(参见下图).在左侧,您可以看到它在Android上的Chrome中的呈现方式,在右侧,您可以看到它在Windows上的Chrome呈现方式.Arial和最常见的字体很好地居中,Segoe Print不是..

我在CSS中尝试了不同的方法来进行对齐,但没有一种方法能够保持一致.我也在同一个小提琴中尝试了相同的结果,由于字体是非自由的,我无法显示.这是一个字体特定的问题,唯一的解决方案似乎是修复字体本身.

这是按钮的CSS(值是虚构的):

div.parent {
    height:40px
}
h3 {
    line-height: 40px;
    font-size: 14px
}