CSS 图片铺满父元素：完整指南及示例代码

.container {
   position: relative;
   width: 100%;
   height: 100%;
}

.container img {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   object-fit: cover;
}

使用 CSS 的 background-size 属性将图片铺满父元素

想要将图片铺满父元素，可以使用 CSS 的 background-size 属性来实现。

步骤

1. 将父元素设置为 relative 定位。
2. 将图片元素设置为 absolute 定位，并将其 top 和 left 属性设置为 0。
3. 使用 width 和 height 属性将图片的尺寸设置为 100%。
4. 使用 object-fit: cover 属性将图片的尺寸适应方式设置为覆盖，保持图片的纵横比例并填充整个父元素。

示例代码

上面的代码示例中，container 类代表父元素，img 类代表图片元素。通过设置 width 和 height 为 100%，以及使用 object-fit: cover，图片将完全覆盖 container 元素。

总结

本文介绍了使用 CSS 将图片铺满父元素的步骤和示例代码。通过简单设置，你可以轻松实现图片填充效果。