为什么chrome mobile调试模式设置了更大的html体宽度而不是设备宽度？

Question

我在html体中有一个图像元素，宽度为440像素，高度为840像素。一切都按预期工作，直到我打开chrome调试模式来模拟它在移动设备中的显示。

screenshot with body width

如屏幕截图所示，模拟器假设宽度为375像素。但是以某种方式变成了964像素的宽度。那里没有任何额外的css脚本或js脚本。只是一个简单的HTML与一个image.screenshot with image width

Answer 1

根据你的截图，chrome显示正确的设备大小为375 x 812.如果你点击屏幕截图中的img会更好。所以不确定你需要什么。问题似乎与图像有关。如果图像的宽度为440px，请在CSS中尝试此操作。

@media (max-width: 480px) {

 body img{
   max-width: 100%;
 }

}