Html 基于div的缩放图像

嗨，我很难让我的图像对div做出响应。有没有一种方法可以简单地让css“切断”不适合的部分，并简单地显示div中适合的部分

HTML

我也在使用twitter引导，但是

class=“img responsive”

不能满足我的需要。当图像没有相同的纵横比时，较短的一面会有空白——它总是试图将整个图像放入div中。还有其他方法吗？我应该为此使用javascript吗？如果是，我该怎么做

---

提前感谢。：）

使用背景尺寸：封面改为背景大小：包含在CSS中，它将帮助您。

使用背景尺寸：封面改为背景大小：包含在CSS中，它将帮助您。

若要使某个对象响应其父节点，您必须为其指定100%的宽度和自动高度

css示例：

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

---

和jsfiddle:

要使某个对象响应其父节点，必须将其宽度设置为100%，并设置为自动高度

css示例：

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

---

和jsfiddle:

如果希望背景图像根据视口在div内缩放，请尝试使用

背景大小：cover

值：

#imgdiv{
  background-image: url(http://lorempixel.com/500/226/fashion);
  background-repeat: no-repeat;
  background-size: cover;
}

---

如果希望背景图像只是“截断”，可以尝试完全忽略

背景大小

属性…

如果希望背景图像根据视口在div内缩放，请尝试使用

背景大小：覆盖

值：

#imgdiv{
  background-image: url(http://lorempixel.com/500/226/fashion);
  background-repeat: no-repeat;
  background-size: cover;
}

---

如果希望背景图像简单地“截断”，可以尝试完全忽略

背景大小

属性…

这可能与另一个问题重复。但是看看这个

---

这可能是另一个问题的重复。但是看看这个

---

不要用背景尺寸。不要用背景尺寸。这个对我有用！非常感谢。使用“罩子”使其即使在拉伸时也能响应！别担心——请接受你认为合适的答案，因为它是未来帮助他人的“正确”答案。这个答案对我很有用！非常感谢。使用“罩子”使其即使在拉伸时也能响应！无需担心-请接受你认为合适的答案，以帮助他人。

img {
   object-fit: cover;
}