今天，我注意到在分辨率为1920 x 1080的Windows pc上，具有100vw渲染的网站如您所愿，主体为width: 1920px ...但是，请切换到分辨率为2880 x 1800的mac，甚至尽管屏幕缩放设置为100％，但主体仅在1440px处渲染？我在Chrome，Firefox和Safari上进行了检查，所有这些都产生相同的结果。
我以为我会创建一个片段来测试该理论。
body{ overflow:hidden }
content{
display: block;
width: 100vw;
height: 100vh;
}<content></content>以像素为单位的内容分辨率的结果（w x h）...请注意，100vh永远不会等于屏幕分辨率的高度。
视窗
Firefox：
1920 x 971Chrome：
1920 x 974IE11：
2258.82 x 1158.82嗯IEOSX
Firefox
1440 x 794Chrome：
1440 x 799Safari：
1440 x 812为什么会这样呢？
最佳答案
CSS处理css pixels，而不是“物理像素”。 2x，3x，4x分辨率正确显示了它们的2x，3x和4x分辨率，但是当涉及到它时，为了不破坏整个网络，浏览器渲染引擎必须将物理像素转换为CSS像素，因此，在2x显示器上的2880分辨率只有1440 CSS像素。