桌面上的innerWidth和outerWidth奇数 [英] innerWidth and outerWidth oddness on desktop

问题描述

在 chrome 中打开控制台(同时在 SO 上)并在 innerWidth + "|"+outerWidth + "|" 中复制+ screen.width，对我来说这将返回 2133|1920|1920，显然 innerWidth 大于 outerWidth... 好像这还不够奇怪，我接下来尝试在 Firefox 中运行此代码，它返回 1920|1936|1920.显然我的 outerWidth 大于我的屏幕尺寸.(所有屏幕通常都最大化).奇怪的是，在普通"页面(不是 stackoverflow)上运行相同的代码将在 Chrome 中返回 1920|1920|1920，但是 firefox 仍然坚持我的 outerWidth 大于我的屏幕.

Open the console in chrome (whilst on SO) and copy in innerWidth + "|"+outerWidth + "|" + screen.width, for me this will return 2133|1920|1920, apparantly the innerWidth is greater than the outerWidth... As if this isn't strange enough I next tried running this code in firefox and it returns 1920|1936|1920. Apparantly my outerWidth is greater than my screen size. (All screens were normally maximized). Strangely enough running the same code on a 'normal' page (not stackoverflow) will return 1920|1920|1920 in chrome, firefox however still insists my outerWidth is greater than my screen.

在谷歌上环顾四周，发现了几篇关于移动设备功能的文章，但似乎没有任何内容可以解释上述观察结果.

Have looked around on google, found a couple of articles regarding the functionality on mobile devices, but nothing seems to explain any of the above observation.

推荐答案

innerWidth 可能大于 outerWidth 的一个原因是您的浏览器被放大了.我在全屏模式下使用浏览器得到以下结果:

One reason innerWidth could be larger than outerWidth is if your browser is zoomed. I got the following results with the browser in fullscreen mode:

zoom  inner  outer
75%   1706   1280
90%   1422   1280
100%  1280   1280
110%  1164   1280

让 outerWidth 大于 screen.width 的唯一方法是通过拖动更改窗口宽度.

The only way I could get outerWidth to be larger than screen.width is by changing the window width by dragging.

这篇关于桌面上的innerWidth和outerWidth奇数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！