结论

父级有 display: flex, 作为子级的图片需要添加 align-self: flex-start

经过

上线了一个新网页，产品提出在他手机上（iPhone 11）有一张图片被拉伸

我猜测是在 iOS 上图片没有按比例缩放，产生了拉伸，就加了个

1

object-fit: contain;

让产品试了下，发现图片不再拉伸了，但图片所在区域占了一个比图片本身高很多的高度

效果就是，图片的上下都有一大片空白

又试了

1

height: auto;

没效果，图片上下依然是大片空白

最后在 stackoverflow 上找到了这个问题

My parent had display: flex so I had to put align-self: flex-start on the image.

就给图片加上了 align-self: flex-start;

好使