摘要：背景图是网页设计中不可或缺的一部分，能够给页面增加层次感和美感。很多时候，为了让背景图贴合整个页面，我们需要进行重复铺满。在CSS中，我们可以使用“repeat-x”和“repeat-y”来设置背景图的重复方式，本文将介绍使用“repeat-y”实现无限重复垂直滚动的技术。一、什么是“rep...

背景图是网页设计中不可或缺的一部分，能够给页面增加层次感和美感。很多时候，为了让背景图贴合整个页面，我们需要进行重复铺满。在CSS中，我们可以使用“repeat-x”和“repeat-y”来设置背景图的重复方式，本文将介绍使用“repeat-y”实现无限重复垂直滚动的技术。

一、什么是“repeat-y”

“repeat-y”是CSS中的一个背景图片属性，它的作用是横向重复（水平方向），垂直方向不重复，这也是和“repeat-x”区别的地方。“repeat-x”则是横向不重复，垂直方向重复。

使用“repeat-y”可以让背景图像不断重复铺满到下一行，从而实现背景无限垂直滚动的效果。

二、使用“repeat-y”实现简单的垂直滚动

首先先来做一个简单的实验，看看使用“repeat-y”能够实现什么样的效果。

代码如下：

```html

无限重复 垂直滚动 背景效果 CSS样式