css如何使用三张图片填充背景，第一张和第三张填充顶部和底部，第二张图片重复填充中间，且不遮挡第一和第二章

你可以使用CSS的`background-image`, `background-repeat`, 和 `background-position` 属性来实现这个效果。下面是一个示例：

.container {
  background-image: url('image1.jpg') no-repeat center top,
                  url('image2.jpg') repeat-y center,
                  url('image3.jpg') no-repeat center bottom;
  background-size: auto 100%; /* 确保第二张图占据整个高度 */
}

/* 如果你想让图片平铺，可以去掉 'no-repeat'，如果不想让图片完全覆盖，可以设置 'contain' 或 'cover' 而不是 'auto' */
.background-image-repeat {
  background-repeat: repeat-y; /* 第二张图片重复 */
}

在这个例子中：
- `.container` 是你需要应用这种背景样式的选择器。
- `url('image1.jpg') no-repeat center top` 定义了第一张图片只显示一次，并放置在顶部。
- `url('image2.jpg') repeat-y center` 定义了第二张图片在垂直方向上重复，并居中对齐。
- `url('image3.jpg') no-repeat center bottom` 定义了第三张图片只显示一次，并放置在底部。

记得将 `'image1.jpg'`, `'image2.jpg'`, 和 `'image3.jpg'` 替换为实际的图片路径。