可以使用CSS的background-image属性来让一张图片作为div的背景,同时使用background-size属性来让图片自适应div的大小,具体代码如下:

<div class="container"></div>

<style>
.container {
  background-image: url('path/to/image.jpg');
  background-size: cover;
  width: 100%;
  height: 0;
  padding-bottom: 50%; /* 以图片的宽高比为基准,撑起div的高度 */
}
</style>

其中,padding-bottom的值可以根据实际情况调整,使得div的高度和图片的高度相同。另外,为了让div能够撑起来,需要将其高度设为0,否则即使设置了padding-bottom也不会生效。

怎样让一张图片作为div的背景 并让图片把div撑起来变得和图片一样大小

原文地址: https://www.cveoy.top/t/topic/bsru 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录