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

Question

我想要一个完全覆盖 div 的图像(没有内容)。我尝试用背景图像和背景大小来做，但由于没有内容，所以它不起作用。我也不想设置高度，因为那样图像会被拉伸(stretch)(我希望它能够响应)。所以我试图通过将图像放入 div 并将其设置为宽度:100% 和高度:100% 来修复它。它起到了作用(图像根据 div 拉伸(stretch))但我在 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;
}

Answer 1

我认为 img 标签的 display: block 会解决这个问题。