html - 仅显示图像的一部分而不使其成为背景图像？

Question

我有这样的图像：

<div id="container">
  <img src="image.jpg">
<div>

我希望图像覆盖容器 div 的宽度和高度 - 现在图像很大并且溢出容器的高度。但是，我无法将其转换为背景图像。

我努力了：

#container {
width: 100%;
height: 200px;
overflow: hidden;
}

但图像仍然超过高度。

有谁知道一种方法来实现用图像填充 div 的相同效果，就像使用background-imageand一样overflow:none？

score 0 · Accepted Answer

我不知道你需要什么。如果你适应它会变得像这样扭曲：

宽度，高度等于容器的高度。

否则你将不得不在图像中添加 css

img{
    height: 100%;
    or width: 100% whichever is less 
}

这就是你需要在这里做的所有事情：http: //jsfiddle.net/tbfwq/

干杯！

score 0 · Accepted Answer

尝试这个

#container img{
width:100%;
}

这会将图像的宽度设置为其父 div 的宽度......希望它对你有用.. 谢谢

2 回答 2