(css)background-image背景图片添加多张

(css)background-image背景图片添加多张

---

.element {
    
    
  background-image: url('image1.jpg'), url('image2.jpg');
  background-position: center top, right bottom; /* 设置每张图片的位置 */
  background-repeat: no-repeat, repeat; /* 设置每张图片的重复方式 */
  background-size: cover, auto; /* 设置每张图片的尺寸 */
}

使用 background-position 属性可以分别设置每张图片的位置。在示例中，第一张图片的位置设置为居中顶部，第二张图片的位置设置为靠右底部。

使用 background-repeat 属性可以设置每张图片的重复方式。在示例中，第一张图片被设置为不重复（no-repeat），第二张图片被设置为默认的重复模式（repeat）。

使用 background-size 属性可以分别设置每张图片的尺寸。在示例中，第一张图片的尺寸被设置为覆盖整个背景区域（cover），第二张图片的尺寸被设置为自动适应原始大小（auto）。