html - 奇怪的 body 溢出-CSS

This question already has answers here:

Image inside div has extra space below the image
                                
                                    （9个答案）
                                
                        
                                2年前关闭。
            
                    
我无法将图像设置为身高的100％。我在页面底部得到了这个奇怪的空白，即使我在所有内容上的边距和填充都设置为0。我可以只使用overflow-y: hidden，但我更想弄清楚为什么这样做。谢谢！

*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html, body {
  height: 100%;
}

img {
  height: 100%;
}

<img src="https://images.unsplash.com/photo-1429554429301-1c7d5ae2d42e?dpr=2&auto=format&fit=crop&w=1500&h=1000&q=80&cs=tinysrgb&crop=" alt="background" />

最佳答案

您需要在display: block上使用img。