Firefox 与 IE 和 Chrome 中的不同字体大小
Posted
技术标签:
【中文标题】Firefox 与 IE 和 Chrome 中的不同字体大小【英文标题】：Different font size in Firefox vs. IE & Chrome 【发布时间】：2016-01-31 14:43:06 【问题描述】：我的网站在开发过程中在 Mozilla Firefox 中使用相同的字体大小声明、边距和填充以及不同的字体系列总是比 Google Chrome 或 Internet Explorer 小一些。
例如字母“O”：
IE: 27 px height
Chrome: 27 px height
Firefox: 24 px height
所有开发者工具都显示 font-size:38px;。我也尝试用 em 值来解决这个问题。但这是同一个问题。
有什么办法可以找出问题所在吗？
【问题讨论】：
请分享您网站的在线链接。 我不得不怀疑...这真的很重要吗？跨浏览器身份真的那么重要吗？因为那里有很多浏览器，都有自己的字体渲染怪癖...... 刚刚在 Chome 和 Firefox 中创建了一个test，这证实了以 pt 为单位的 px 字体的差异。使用 line-height 计数至少可以使行的高度相同，但不能解决某些浏览器中字体更大/更小的事实。 蓝线：32 px Firefox，31 px Google Chrome 红线：32 px Firefox，31 px Google Chrome 我添加了 font-family:Arial。 我已经测试了过去 1.5 小时，发现了错误。我的密码管理器插件是问题制造者！停用它一切正常。 【参考方案1】：我认为这对你有帮助。
<html>
<head>
<!--[if IE]>
<style>
body
background-color:red;
</style>
<![endif]-->
<style>
@-moz-document url-prefix()
body
background-color:green;
body
background-color:yellow;
</style>
</head>
</html>
【讨论】：
发现问题！密码管理器是麻烦的根源！谢谢你的询问。以上是关于Firefox 与 IE 和 Chrome 中的不同字体大小的主要内容，如果未能解决你的问题，请参考以下文章
表格布局问题 - Firefox 与 Chrome 和 IE7
IE/Firefox 中的填充和/或边距与 Chrome 不同
输入范围样式 IE11/Firefox 与 Chrome 相同
Firefox 和 Opera/Chrome/IE 中的表单填充差异