如何调整 div 中的图像大小以覆盖？ [复制]答案

【问题标题】：How to resize image in div to cover? [duplicate]如何调整 div 中的图像大小以覆盖？ [复制]
【发布时间】：2016-09-06 23:35:34
【问题描述】：

好的，我想你以前听过这个……我试图找到解决方案，但找不到。我有一个覆盖屏幕左侧 50% 的容器。在容器内部，我想要一个图像来覆盖空间，而不是拉伸。此时的css是：

height: auto;
max-width: 100%;

请帮忙！！！

【问题讨论】：

【解决方案1】：

• 如果您的图片大于您希望它覆盖的空间，并且您使用 img 标签来做到这一点，请将其添加到您的 css：

img {width: auto; height: auto;}

• 如果您使用 div 将图像作为背景图像放置，请使用：

div {
    background-image: url("yourimage.png");
    background-repeat: no-repeat;
    background-size: contain;
}

【讨论】：

【解决方案2】：

您可以将其用作背景并使用以下属性：

background-repeat: no-repeat;
background-position: center center;
background-size: cover;

【讨论】：

【解决方案3】：

在您的 div 中添加 img 并将图像的宽度和高度设置为 100%；

<div> <img src=""/> </div>

css

img {
width: 100%;
height: 100%;
}

【讨论】：