浏览器渲染Gentium Plus字体时大写字母A尺寸异常高于Figma设计的问题求助
浏览器渲染Gentium Plus字体时大写字母A尺寸异常高于Figma设计的问题求助


大家好,
我最近碰到个挺闹心的问题:在用Google字体里的Gentium Plus时,浏览器渲染出来的大写字母A,比Figma设计稿里的要高出大概2像素,这个差异看着特别扎眼,我已经在第一张图里把这个问题标出来了。
目前我梳理了几个关键信息:
- 浏览器和Figma用的是完全相同的字号和行高:1.6rem和23px
- 我在HTML全局设置了
html { font-size: 10px; } - 更奇怪的是,当我把字号改成1.8rem(对应18px)或者1.9rem(对应19px)时,浏览器里的字体显示就和Figma里的正常效果完全一致了,第二张图就是这个正常状态的样子
我真的特别中意这个字体,不想因为这个小问题就放弃它,所以如果有大佬能帮我分析下背后的原因,或者给点解决的思路,我真的会超级感谢!
备注:内容来源于stack exchange,提问作者dfr




