css - 即使在正文中设置了绝对大小，移动 Firefox 上的字体大小与移动 Chrome 不同

Question

问题：移动 Firefox 和 Chrome 上的字体大小呈现不一致（见下图）。这只发生在某些页面上而不是其他页面上。具体来说，em缩放在两个移动浏览器上的呈现方式不同。我正在使用@media查询来定位移动视口并执行em缩放。在两个浏览器上的桌面字体大小是相同的。

我试过的：我怀疑字体大小的级联不同，但很难说，因为有些页面渲染得很好。我已经px在 body 及其子项上应用了 CSS Reset 和 absolute font-size ，并按照这个问题的答案的em建议。我还使用自定义@fonts，声明如下：

@font-face {
  font-family: 'tf0r';
  src: url(../../client/typefaces/tf0r.eot); 
  src: url(../../client/typefaces/tf0r.eot?#iefix) format('embedded-opentype'),
       url(../../client/typefaces/tf0r.woff2) format('woff2'),
       url(../../client/typefaces/tf0r.woff) format('woff'),
       url(../../client/typefaces/tf0r.ttf)  format('truetype'),
       url(../../client/typefaces/tf0r.svg#tf0r) format('svg');
  font-style: normal;
  font-weight: normal;
  font-stretch: normal;
  text-rendering: optimizeLegibility;
}

到目前为止，这个问题的答案是最有帮助的。应用时设置font-size-adjust: 1属性body确实会粗略地放大未正确呈现的页面，但它也会放大其他页面，使它们变得非常大。我可以使用此属性定位特定元素，但我想知道是否可以找到更一致的解决方案。

标签： cssfirefoxfonts