为什么在Opera中使用更大的字体大小呈现文本？

Question

我正在开发一个需要或多或少像素完美的HTML页面,我注意到在Opera 10中,字体比其他浏览器渲染得更大,即使字体大小实际上是相同的.

请参阅Opera 10中的此示例页面以及Firefox 3.6等其他浏览器:

http://troy.onespot.com/static/stack_overflow/opera_font_size.html

或者,这是一个说明问题的屏幕截图:

http://skitch.com/troywarr/d47m1/font-size

"50px"和"46px"文本背后的红色框(两者都具有相应的字体大小)都具有50px的高度.

在Firefox 3.6中,"50px"中"p"的下行与其后面的红色框的底部对齐.在Opera中,"50px"中"p"的下降位于下方; 它是"46px",更接近Firefox中的"50px".这告诉我,Opera在10%的范围内渲染字体太大了.

这与其他正文的问题完全相同,在Opera 10中完全抛弃了我的页面布局.如果您对可能导致此问题的原因有任何想法,或者至少如何预防/修复它,请告诉我.

谢谢!

---

更新:

似乎我没有安装Helvetica的正确副本 - 我从字体堆栈中删除了它,并且在我的测试页面上看到的渲染文本没有区别.

我更新了测试页面只使用通用的"sans-serif"字体系列,所以希望我们现在都看到同样的事情.

有趣的是,使用通用的"serif"字体在Opera和Firefox中显示完全相同.

这个问题可能只是一个关于Opera如何显示通用"sans-serif"字体的怪癖？

---

更新2:

这可能很重要:我使用的是Mac OS X Snow Leopard.我现在正在尝试其他字体,看看我是否可以进一步隔离这个问题.

---

更新3:

我使用Arial创建了另一个测试页面:

http://troy.onespot.com/static/stack_overflow/opera_font_size_reset_arial.html

现在Opera和Firefox几乎完全匹配!

在这个项目中,我可能会使用Arial代替Helvetica.据我所知,我有一个完整的OS X版本的Helvetica - 所以我不能在不同的用户看到我的页面上的字体之间有任何差异.我会坚持使用久经考验的Arial.

但是,这意味着什么呢？OS X的默认sans-serif字体只是在Opera中呈现奇怪的东西？

Answer 1

当我在Windows 7 x64上遇到与Opera 11.10类似的问题时,我遇到了这个帖子.

Opera默认使用20px作为正文字体大小(而不是其他浏览器使用的16px).即使在卸载,删除Opera首选项和重新安装后,这仍然存在.事实证明,Opera将尊重您的系统字体大小首选项 (在Win7上的"控制面板\外观和个性化\显示"下设置)以呈现网站文本而其他浏览器(我测试过FF4,Chrome 11,Safari 5,IE 9)不要.我的系统字体大小设置为125%,这解释了20px.一旦我将系统字体缩放设置为100%,Opera的行为与其他字体相同.

我不确定哪种行为更正确(在某种程度上,Opera很尊重我的字体选择),但由于其他浏览器不做同样的事情,因此它是"意外的".我没有Mac测试,但MacOS可能有类似的系统字体偏好？

Answer 2

我怀疑 Opera 使用Sans-serif与其他浏览器不同的后备字体。这应该可以通过使用系统上安装的不同字体来确认或消除。