background-repeat: repeat 是默认行为,不写也一样;常见问题多因 background-size、容器尺寸或 background-position 导致视觉上未显重复;repeat、repeat-x、repeat-y 区别在于铺放方向;Safari 对内联 SVG 有轻微兼容问题。background-repeat: repeat 是默认行为,不写也一样绝大多数情况下,background-repeat 根本不用显式设为 repeat------浏览器默认就是它。你写了反而多此一举,还可能掩盖真正的问题。常见错误现象:background-image 没铺开,只显示一张图,第一反应就去加 background-repeat: repeat,结果没用。这时候真问题往往在别的地方:background-size 被设成了 cover 或 contain,直接压制了重复逻辑背景图本身尺寸太大,单张就撑满容器,根本没机会"重复"父容器高度为 0 或未触发 BFC,导致背景无处可铺repeat 和 repeat-x / repeat-y 的实际差异在哪三者控制方向不同,但关键不是"能不能铺",而是"往哪铺"。repeat 是双向铺(x 和 y 都重复),repeat-x 只横向铺,repeat-y 只纵向铺。使用场景举例:立即学习"前端免费学习笔记(深入)";做横条纹背景:用 repeat-x + 1px 高图片,比 repeat 更省渲染压力做侧边导航底纹:repeat-y 配合窄图,避免纵向拉伸失真老式网页纹理背景:必须用 repeat,否则留白或错位性能影响:现代浏览器对三者优化差别不大,但 repeat-x 在超长容器中可能略快------毕竟少算一维。 NameGPT名称生成器 免费AI公司名称生成器,AI在线生成企业名称,注册公司名称起名大全。
相关推荐
lusklusklusk44 分钟前
Oracle数据库基础之2_体系结构老歌老听老掉牙1 小时前
从三维旋转的深度解析到Python实现:绕任意轴旋转的奥秘可乐ea1 小时前
从第一性原理构建 AI Agent:提示词、工具、技能与记忆全解剖打工仔折腾 AI1 小时前
工业场景下时序库与实时计算一体化架构选型实践对比东方护航数据恢复(深圳)1 小时前
医疗案例:HIS/PACS 数据库页损坏修复,医院不停诊完成恢复【东方护航数据恢复深圳店】梦幻精灵_cq2 小时前
sumdir——一个伪python.built-in的“术法”打造lusklusklusk2 小时前
Oracle数据库基础之11_Duplicate和Dataguard和RACweixin_440730503 小时前
函数return、参数、参数组、递归函数、高阶函数等小结天赐范式3 小时前
天赐范式第181天:让视图开始切换——PBFT视图切换与从safety到liveness的跨越sugarzhangnotes3 小时前
【无标题】