如何在CSS中添加多张图片？

div {
  background-image: url(image1.jpg), url(image2.jpg), url(image3.jpg);
  background-repeat: no-repeat;
  background-position: top left, top right, bottom center;
}

<div class="image-container">
  <div class="image" style="background-image: url(image1.jpg);"></div>
  <div class="image" style="background-image: url(image2.jpg);"></div>
  <div class="image" style="background-image: url(image3.jpg);"></div>
</div>

.image-container {
  display: flex;
}

.image {
  width: 200px;
  height: 200px;
  background-repeat: no-repeat;
  background-position: center;
}

div::before {
  content: url(image1.jpg);
}

div::after {
  content: url(image2.jpg);
}