Html 手机上未显示图像

我尝试在不同的屏幕大小上显示不同的图像。如果我调整窗口大小，禁用缓存并刷新它是可以的，但当我选择设备以特定屏幕分辨率查看结果时，图像不会正确显示。当设备为iPad（768x1024）时-显示图像1170x425，iPhone（375x667）-显示图像768x480。移动设备的图像未加载。我做错了什么

img{
最大宽度：100%；
}

---

您应该定义您的尺寸：

<img srcset="elva-fairy-320w.jpg 320w,
             elva-fairy-480w.jpg 480w,
             elva-fairy-800w.jpg 800w"
     sizes="(max-width: 320px) 280px,
            (max-width: 480px) 440px,
            800px"
     src="image-800w.jpg">

调整大小时，它似乎正常工作，但如果您使用的是真实设备，则情况并非如此。您是否100%确定ipad的宽度为768px？背景颜色是否会变为红色？我在模拟器iPad pro 9.7英寸，iOS 10.2上进行测试。iPhone上显示的小图像显示的浏览器宽度为770px？哪个是小图像？哪部iPhone？