(css) background-image add multiple background images
.element {
background-image: url('image1.jpg'), url('image2.jpg');
background-position: center top, right bottom; /* 设置每张图片的位置 */
background-repeat: no-repeat, repeat; /* 设置每张图片的重复方式 */
background-size: cover, auto; /* 设置每张图片的尺寸 */
}
Use the background-position property to set the position of each image individually. In the example, the position of the first image is set to center top and the position of the second image is set to bottom right.
Use the background-repeat property to set how each image repeats. In the example, the first image is set to no-repeat, and the second image is set to the default repeat mode (repeat).
Use the background-size property to set the size of each image individually. In the example, the size of the first image is set to cover the entire background area (cover), and the size of the second image is set to automatically fit to the original size (auto).