要让背景图片只在垂直方向重复，需使用 background-repeat: repeat-y；必须先设置 background-image，可配合 background-position 和 background-color 优化效果，避免语法错误。
设置背景图片纵向重复
要让背景图片只在垂直方向（Y轴）重复，关键在于使用 background-repeat: repeat-y。这个值会保持图片在水平方向只显示一次，而在垂直方向无限向下铺开。
基础写法示例
直接在 CSS 中声明即可：
body {
background-image: url("pattern.png");
background-repeat: repeat-y;
}
注意：必须先设置 background-image，否则 repeat-y 不生效。
常见配合技巧
- 用 background-position 控制起始位置，比如 background-position: center top 可让图片从顶部中央开始纵向重复
- 搭配 background-color 防止图片加载延迟时露出空白背景
- 若容器高度过小（如仅靠文字撑开），可能看不到重复效果——建议给容器设最小高度（min-height: 100vh）或确保有足够内容
避免典型错误
别写成 repeat-y center 或 y-repeat，这些不是合法语法；也别漏掉 background-image，否则 repeat-y 没作用对象。不复杂但容易忽略。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
