Html 为什么是;字体大小:1em“;IE10比Chrome更大?
我目前正在开发一个网站,我不明白为什么IE10显示的文本比Chrome显示的文本大。(我已经确保两种浏览器都设置为100%缩放——不多也不少。) 我的CSS中有一个重置:Html 为什么是;字体大小:1em“;IE10比Chrome更大?,html,css,internet-explorer,google-chrome,internet-explorer-10,Html,Css,Internet Explorer,Google Chrome,Internet Explorer 10,我目前正在开发一个网站,我不明白为什么IE10显示的文本比Chrome显示的文本大。(我已经确保两种浏览器都设置为100%缩放——不多也不少。) 我的CSS中有一个重置:正文{font size:1em;}。在Chrome(v27.0.1453.116 m)中,如果我将CSS中的规则更改为font-size:100%,则显示结果与预期一致或字体大小:16px,没有明显变化。对我来说,这表明在铬合金中,1em=16px。但是比例字体大小(em和%)在IE中显示得更大,看起来是1em=21px 我有
正文{font size:1em;}
。在Chrome(v27.0.1453.116 m)中,如果我将CSS中的规则更改为font-size:100%,则显示结果与预期一致代码>或字体大小:16px代码>,没有明显变化。对我来说,这表明在铬合金中,1em=16px。但是比例字体大小(em
和%
)在IE中显示得更大,看起来是1em=21px
我有两张图片显示了当body{font-size:1em;}
时的差异,但由于我还没有10个声誉,我无法发布完整的URL。但它们托管在imgur上,其文件名如下:
字体大小:1em代码>在Chrome中:
字体大小:1em代码>在IE10中:
如果我使用px
设置font size
,那么我会得到一致的结果——Chrome和IE10都会一致显示。但是使用px
作为字体大小,这几天我觉得这并不是首选的做法
您可以在中看到HTML和CSS。我包括了所有的CSS,这可能有点不必要,但我认为最好提供更多的上下文而不是更少的上下文
有人能帮我弄清楚为什么IE10显示的1em
比Chrome大,我能做些什么吗
非常感谢
编辑——我一发布这个精心设计的问题,就知道发生了什么。我已经将IE的缩放设置为100%,但IE还有一个“文本大小”选项,出于某种原因,该选项被设置为“最大”。将其设置为“中等”修复了该问题。em的大小(以像素为单位)与您使用的字体类型和大小、屏幕分辨率(取决于操作系统、浏览器)以及可能的进一步操作系统和浏览器设置有关-例如“显示字体+10%”可能会改变em值
根据鲁杜的说法。我已经“解决”了自己的问题,因为我是个傻瓜
IE10有两个设置,都在“视图”菜单下,可以改变显示内容的大小。我确保“缩放”设置设置为100%,但完全忽略了“文本大小”设置,即设置为“最大”。将其设置为“中等”修复了我的问题,并使IE和Chrome显示完全相同。这是浏览器默认的字体大小。我很确定这会发生,因为各自的html呈现引擎以略微不同的方式呈现该字体,但我不确定该怎么办。哦,该死的,我把IE的缩放设置为100%,但很明显,IE还有一个“文本大小”选项被设置为“最大”。当设置为“中等”时,它按预期显示。好吧,这太令人讨厌和尴尬了。@Cyborgx37,试着测量字母“M”的大小,你会发现它的宽度和高度都不等于1em
@JukkaK.Korpela-你是对的。我对这个词的用法是。犯错是人的行为,不是特别愚蠢。你可以接受你的答案,这似乎是正确的,即使这个问题有点困惑。问题实际上与代码中的字体大小设置无关。我认为在不同浏览器中使用相同字体大小的最佳方法是为正文设置固定字体大小,然后在需要时使用rems更改其他元素的字体大小。