使图像适合其父元素

我有一个直立的div（宽度=身体的33％;身高=身体的100％），其中包含一个图像。 此图像应覆盖整个div 而不会失去其纵横比。 我目前使用高度= 100％，但是它的宽度超出了父母div。 有任何想法吗？

Answer 1

您可以使用背景图像来实现此目的，使用cover属性为background-size ，例如：

然后在你的CSS中：

 .my-tall-div { background: url(/path/to/image.jpeg) center center no-repeat; background-size: cover; } 

Answer 2

我认为这是最小宽度：100％; 或设置您网站的像素。 然后它也会响应

Answer 3

实际上你仍然可以使用@toomanyredirects答案。

只需调整它，以便将类设置为标记。

 .imgCover { background: url(imgpath) no-repeat center; background-size: cover; } 

并像这样使用它：