图像设置为 100% 但底部仍有边距

Image set to 100% but still margin at the bottom

我想要一张完全覆盖 div(无内容)的图像。我尝试用背景图像和背景大小来做,但由于没有内容,所以它不起作用。我也不想设置高度,因为那样图像会被拉伸(我希望它能够响应)。所以我试图通过将图像放入 div 并将其设置为 width:100% 和 height:100% 来修复它。它起到了作用(图像根据 div 进行了拉伸)但是我在 img 的底部仍然有一个小边距,我似乎无法将其删除。我将所有边距和填充设置为 0px 但仍然没有结果(甚至 border-sizing 设置为 border-box)。谁能告诉我我做错了什么?我没有设置高度所以,看到其他问题,也许 div (wrapper-1) 没有设置点来适应?这是将图像放入没有内容的 div 的正确方法吗?提前致谢!

HTML:

<div class="row col-12  wrapper-1"><img src="wrapper.jpg" alt="Wrapper" 
width="100%" height="100%" /></div>

CSS:

.wrapper-1 {
 height: auto;
 padding: 0px;
 margin: 0px auto;
 }
* {
box-sizing: border-box;
}
img {
max-width: 100%;
height: auto;
margin: 0px auto;
padding: 0px;
}

我认为 img 标签的 display: block 可以解决问题。