图片未覆盖整个“ div”区域

Question

我一直在网上寻找可行的解决方案，但是找不到明确的答案，所以我将其发布在这里。

问题是我想让图像覆盖整个，但是图像下方似乎有一些剩余空间，我似乎无法将其填满。我正在考虑图中的蓝色空间：

我不需要解决方案。我只想要一个能解决问题的最终解决方案

Answer 1

只需在您的img标签中添加display: block或vertical-align: top。

img {
	width: 100%;
	height: auto;
  display: block;
}

.cover {
	background-color: blue;
}

<div class="cover">
	<img src="//unsplash.it/460/345" width="460" height="345" alt="">
</div>

Answer 2

尝试更改

img {
width: 100vw;
height: 100vh;
display:block
}

如果您可以发布jsfiddle，那就太好了。这样我们就可以查看您的实际代码了。

Answer 3

我通常对图像执行的操作是首先确定图像是横向还是纵向（即，图像宽于高还是反之）。然后根据方向将图像的高度或宽度设置为100％。然后溢出：隐藏在父容器上，这样结果就是保留宽高比并覆盖容器的图像。