如何在 div 中设置响应式图像？

Question

我在 div here 中有一张微笑的房子的图像，我尝试使用以下方法使其具有响应性：

*img-responsive(引导类)

*背景尺寸：封面； 背景大小：包含； 背景尺寸：自动；

分别给这些。 一切都失败了……有人有更好的解决方案吗？

PS：文字和图片的位置不应该改变。

找到了解决方案：我删除了 div，只添加了图像。现在可以正常使用了。

Answer 1

您的background-size:auto; 会覆盖之前的设置。

Cover 会拉伸以适应 div，从而导致剪裁。包含将拉伸以适应而不剪裁。

background-image: url(''); 
background-size: contain; 
background-position:center center;
background-repeat: no-repeat;