在CSS中，大家可以使用background-image属性来添加背景图片。但是有时候大家需要在一个元素上叠加多张图片，这个时候就需要用到CSS叠加图片的技术。
/*CSS code*/
div{
background-image: url("bg.jpg"), url("overlay.png");
background-repeat: no-repeat, repeat;
background-position: center, top left;
}在上面的代码中，大家使用了background-image属性来叠加两张图片，分别为“bg.jpg”和“overlay.png”。其中，左边的图片在上面，右边的图片在下面。
接下来，大家需要设置每张图片的重复方式和位置。
background-repeat属性用于控制图片的重复方式，可以设置以下值：
- repeat：图片在水平和垂直方向上重复
- repeat-x：图片在水平方向上重复
- repeat-y：图片在垂直方向上重复
- no-repeat：图片不重复
上面的代码中，大家设置了左边的图片不重复，右边的图片在垂直方向上重复。
background-position属性用于控制图片的位置，可以设置以下值：
- left top
- left center
- left bottom
- center top
- center center
- center bottom
- right top
- right center
- right bottom
- x% y%
- xpos ypos
上面的代码中，大家将左边的图片居中，右边的图片位于左上角。
通过使用CSS叠加图片，大家可以轻松地实现网页元素的层叠效果，为网页增加更多的视觉效果和趣味性。