在上面的屏幕截图中，Google Chrome 的（元素/网络）检查器工具显示菜单项的尺寸为 547 x 308 像素。
现在，我可以确定所有现代浏览器（IE9 及更高版本、Chrome、Opera、Firefox）也可以通过相同的尺寸识别菜单项吗？如果不是，它是如何变化的？（例如字体渲染？）
编辑：我是否使用 CSS 重置样式表。更具体地说，我使用了Normalize.css，它非常流行。
问问题
132 次
2 回答
4
你不能确定。原因是浏览器有所谓的用户代理样式表。这些是浏览器可以设置为任何他们想要的默认样式。例如，Chrome 的用户代理样式表定义了p标签的顶部和底部边距。
为了确保您显示的内容相同，您需要覆盖用户代理样式表。最好的方法是使用所谓的 CSS 重置样式表，它会尝试删除浏览器定义的任何属性。
您可以在此处阅读有关用户代理样式表的所有信息。这里有一些 CSS 重置样式表。
于 2012-12-20T17:37:14.670 回答
3
除非你指定width: 547px; height: 308px然后没有。如果您允许元素根据后代元素的大小缩小和增长（并且后代的尺寸不受固定宽度或高度的限制），那么它会有所不同。
您永远无法确定用户如何根据字体大小配置他们的浏览器（有些用户喜欢更大的字体大小，这样更容易阅读）。您甚至无法确定用户是否指定了 font-family，并且他们的默认 font-face 可能具有比您预期的更宽或更窄的字形。
于 2012-12-20T17:43:15.137 回答