关于img元素
img元素的默认display值是inline，但是一般设置为block，MDN也是这么建议。
虽然设置img元素display: block;，但是其表现并不是完全按照块状元素，“可替换元素”有着自己的一套宽高的计算方式。默认情况下，图片是1:1的形式显示在页面上，并没有像div之类的块状元素一样自动铺满整个宽度。因此，为了防止图像宽度超出页面，一般需要再设置max-width: 100%;。
img元素默认宽高比例是和图片保持一致的，即当你只设置了宽度时，页面会自动计算对应的高度并显示图片，单独设置高度时也是一样的计算；如果你同时设置了宽度和高度，则按照你设置的进行显示。
参考文章:
使用img自动撑开高度