SRCSET无法传递正确的图像

Question

根据srcset的文档，如果我们未在图片中指定sizes，则浏览器将在渲染CSS后自动选择正确的图片。

<style>
  img {
    width: 400px;
  }
</style>
<img
  src="https://cdn.statically.io/img/wpspeedmatters.com/wp-content/uploads/2019/11/migrating-birds.jpg"
  srcset="
    https://cdn.statically.io/img/wpspeedmatters.com/wp-content/uploads/2019/11/migrating-birds.jpg?w=400   400w,
    https://cdn.statically.io/img/wpspeedmatters.com/wp-content/uploads/2019/11/migrating-birds.jpg?w=700   700w,
    https://cdn.statically.io/img/wpspeedmatters.com/wp-content/uploads/2019/11/migrating-birds.jpg?w=900   900w,
    https://cdn.statically.io/img/wpspeedmatters.com/wp-content/uploads/2019/11/migrating-birds.jpg?w=1400 1400w,
    https://cdn.statically.io/img/wpspeedmatters.com/wp-content/uploads/2019/11/migrating-birds.jpg?w=2000 2000w,
    https://cdn.statically.io/img/wpspeedmatters.com/wp-content/uploads/2019/11/migrating-birds.jpg?w=3000 3000w
  "
/>

在上面的示例中，图像在CSS中的大小调整为400px宽。 srcset中给出了所有可能的大小。例如400px，700px，900px，1400px，2000px，3000px。

浏览器不会选择宽度为400px的图像，而是会选择2000px的图像。在手机上也是如此。