HTML 背景图片设置：拉伸、平铺、不重复

要设置 HTML 背景图片的拉伸、平铺和不重复，可以使用 CSS 的 background 属性。

拉伸

要拉伸背景图片，可以使用 background-size 属性。例如，要将背景图片拉伸到整个屏幕，可以将 background-size 设置为 100% 100%。

body {
  background-image: url('background.jpg');
  background-size: 100% 100%;
}

平铺

要平铺背景图片，可以使用 background-repeat 属性。默认情况下，背景图片会在水平和垂直方向上平铺。可以将 background-repeat 设置为 no-repeat，以防止图片重复。

body {
  background-image: url('background.jpg');
  background-repeat: no-repeat;
}

不重复

如果要防止背景图片在水平和/或垂直方向上重复，可以将 background-repeat 设置为 no-repeat，并将 background-size 设置为 cover 或 contain。cover 将图片放大或缩小，以完全覆盖背景区域。contain 将图片缩小或放大，以适合背景区域。

body {
  background-image: url('background.jpg');
  background-repeat: no-repeat;
  background-size: cover;
}