CSS背景图片自适应大小

这里只介绍两种方式，一种是利用<img>标签，一种是设置style的background；当然肯定不止这两种方式<img>标签/* css */img{position: fixed;width: 100%;height: 100%;z-index: -1;}backgroundbody {background: rgb(129, 155, 190) url(背景.jpeg

仙女叔叔

17818人浏览 · 2022-01-14 13:47:29

仙女叔叔 · 2022-01-14 13:47:29 发布

这里只介绍两种方式，一种是利用<img>标签，一种是设置style的background；当然肯定不止这两种方式

<img>标签

/* css */
img{
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: -1;
}

background

body {
    background: rgb(129, 155, 190) url(背景.jpeg);
    /* 决定背景图像的位置是在视口内固定，或者随着包含它的区块滚动 */
    background-attachment: fixed;
    /* 图片可以保有其原有的尺寸，或者拉伸到新的尺寸，或者在保持其原有比例的同时缩放到元素的可用空间的尺寸。 */
    background-size: cover;
    width: 100%;
    height: 100%;
  }

学习