拟合大背景图像以适应小div

Question

所以我有一个700px宽度的图像，这是我用作宽度为200px的div中的背景图像。

我希望将图像保持在该大小，以便为较小的设备保持良好的分辨率。 然而，我遇到的问题是因为图像比图像溢出（隐藏）的div大，但我希望图像根据div的大小调整大小并适合，而不是溢出。

我的div目前是：

.featurebox{
background: #F9C112 url(../img/pan1.jpg) no-repeat center top ;
width:200px
}

Answer 1

定义宽度和高度，然后使用background-size: cover

Answer 2

你能试试吗？

background-size:100%;

Answer 3

尝试添加此内容：

background-size: 100% 100%;

如果您使用

background-size: 100%;

高度设置为自动，然后仍然可以重叠。

Answer 4

您可以设置背景大小：

.git/modules

.featurebox {
background: #F9C112 url(https://upload.wikimedia.org/wikipedia/en/2/24/Lenna.png) no-repeat center top;
background-size: 200px 200px;
width: 200px;
height: 200px;
}