背景图可以为网站增添更好的视觉效果，而背景图重复则是为了能够填充整个页面。在CSS中，我们可以利用background-repeat属性来实现背景图的重复。
background-repeat的基本使用
background-repeat属性有几个值可供选择：
- repeat：默认值，背景图横向和纵向都会重复；
- repeat-x：背景图只在横向重复；
- repeat-y：背景图只在纵向重复；
- no-repeat：背景图不重复。
通过设置background-repeat属性，可以很方便地控制背景图的重复方式。例如：
body {
background-image: url(bg.png);
background-repeat: repeat-x;
}
这样就可以使背景图只在横向上重复，而在纵向上不重复。
background-repeat和background-size结合使用
有时候，我们会想要改变背景图的大小，以达到更好的页面效果。这时候，就可以用到background-size属性。但是，如果在改变背景图大小后，仍然让其重复，可能会导致图片出现拉伸、变形等问题。这时候，我们可以将background-repeat和background-size结合起来使用。
为了保证背景图不拉伸、变形，我们可以将background-size设置为cover或contain，来自适应背景容器，并使其覆盖或居中容器。例如：
body {
background-image: url(bg.png);
background-repeat: no-repeat;
background-size: cover;
}
这样一来，背景图就会自适应容器，并且不会出现变形问题。
background-repeat多背景图结合使用
有时候，我们会需要在同一个元素上添加多个背景图。这时候，我们可以利用background-repeat来控制每个背景图的重复方式。
多背景图的应用可以让页面方案更加灵活，如可以增加页面深度感。例如：
body {
background-image: url(bg1.png), url(bg2.png), url(bg3.png);
background-repeat: no-repeat, repeat-x, repeat-y;
background-position: bottom right, top left, top right;
}
通过这样的设置，就可以使两个背景图分别在横向和纵向上重复，并且能够有不同的位置显示。
总之，background-repeat可以很方便地控制背景图的重复方式，同时也可以结合background-size和多背景图使用，让页面效果更加优美和灵活。