显式声明 background-repeat: repeat 最稳妥，因 background 简写会重置所有子属性；内联 style 必须同时设 background-image 和 background-repeat；js 中需用驼峰式 backgroundrepeat 且值小写。
background-repeat: repeat 是默认行为，但显式声明更可靠
很多开发者以为只要设置了 background-image，图片就会自动铺满整个容器——这没错，因为 repeat 确实是 background-repeat 的默认值。但问题在于：一旦你或团队其他人在某处写了 background: url(...) no-repeat; 这类简写，它会**重置所有背景子属性**，包括把 background-repeat 强制设为 no-repeat，后续再单独改 background-image 也救不回来。
所以，要确保铺满，最稳妥的做法是显式写上：
-
background-repeat: repeat;（CSS 规则中） - 或
element.style.backgroundRepeat = "repeat";（JS 动态设置） - 避免只依赖默认值，尤其在多人协作或使用 CSS 框架时
用内联 style 设置 background-repeat 时，别漏掉 background-image
直接在 HTML 标签里用 style 属性配 background-repeat 很方便，但常见错误是只写重复方式，忘了配图源：
这段代码完全无效——background-repeat 没有作用对象，浏览器根本不会去加载或渲染任何背景图。
正确写法必须同时指定图像路径：
- 路径要用单引号或双引号包裹，否则空格或特殊字符会导致解析失败
- 相对路径以当前 HTML 文件为基准，不是 CSS 文件位置
repeat-x 和 repeat-y 在实际布局中容易引发滚动条错觉
当你用 repeat-x 做顶部横条、或 repeat-y 做侧边竖纹时，如果容器高度/宽度没约束好，很容易出现意料外的滚动条。
比如给 <div> 设了 <code>background-repeat: repeat-y，但没设 height 或 min-height，内容撑高后，背景图会一路向下重复——用户拉滚动条时，可能误以为“背景没铺满”，其实是它真在重复，只是超出了初始视口。
- 检查是否遗漏
height/min-height/max-height - 用浏览器开发者工具的「Computed」面板确认最终生效的
background-repeat值，排除被其他规则覆盖 -
repeat-y配合background-position: top更可控，避免从中间开始重复
JS 动态修改 backgroundRepeat 时，注意大小写和拼写
DOM API 中这个属性名是 backgroundRepeat（驼峰式），不是 CSS 里的连字符写法 background-repeat。写错就静默失败，无报错，极难排查。
典型错误写法：
-
el.style.background-repeat = "repeat";→ 报错：Invalid left-hand side in assignment -
el.style.backgroundrepeat = "repeat";→ 无效果（属性名不存在） -
el.style.backgroundRepeat = "REPEAT";→ 大部分浏览器不识别全大写值
正确写法只有这一种：
el.style.backgroundRepeat = "repeat";- 值必须小写，且严格匹配
"repeat"/"repeat-x"/"no-repeat"等标准字符串 - IE8 及更早版本不支持
"inherit"，如需兼容，避免使用
background-repeat 看似简单，真正卡住人的往往不是语法，而是它和其他背景属性（尤其是 background 简写、background-size、缓存导致的图片未更新）混在一起时的隐性冲突。动手前先打开 DevTools 的 Styles 面板盯住实时计算值，比猜快得多。
