table或td上background-repeat不生效，主因是元素高度塌陷或样式覆盖；需显式设height/min-height、避免border-collapse无padding、检查全局重置；repeat-x平铺需配background-size:auto及background-position:top left；background简写中repeat-x须紧接url()后、斜杠前。
table 或 td 元素上 background-repeat 不生效？
直接给 <table> 或 <td> 设 background-image 后发现图片没平铺，大概率是元素高度塌陷或被其他样式覆盖。表格单元格默认没有固定尺寸，内容为空时高度为 0，背景区域就不存在。
- 必须显式设置
height或min-height（如min-height: 40px;），或确保单元格内有内容/内边距撑开尺寸 - 避免用
border-collapse: collapse后又忘了给td加padding——这会让视觉上“没空间”，实际背景仍存在但被挤到不可见 - 检查是否被重置 CSS 覆盖，比如全局设置了
* { background-repeat: no-repeat; }，此时需在td上强制写background-repeat: repeat;
如何让小纹理图在 table 中横向平铺（repeat-x）？
适用于条纹表头、分隔线等场景，关键在于控制重复方向和起始位置，同时防止纵向拉伸变形。
- 使用
background-repeat: repeat-x;，不是repeat或no-repeat - 搭配
background-size: auto;（默认值），保持原始像素尺寸平铺；若需加宽单个图块，可设background-size: 24px auto; - 用
background-position: top left;确保图块从左上角开始对齐，避免错位接缝 - 注意：若
td高度远大于图片高度，repeat-x下只显示一行图块，其余是空白——此时应配合min-height或固定height控制视觉密度
table 背景图定位偏移总不准？
background-position 在表格单元格里行为和普通块级元素一致，但容易因盒模型或文字对齐干扰判断。
- 优先用关键词组合，如
background-position: center center;或background-position: right bottom;，比像素值更可靠 - 避免混用
vertical-align和background-position——前者影响内容对齐，后者影响背景起点，二者无直接关系，但视觉上易误判偏移原因 - 如果背景图要“贴右对齐”，别只设
background-position: right;，记得补background-repeat: no-repeat;，否则repeat会覆盖定位效果 - 调试时打开浏览器开发者工具，悬停查看 computed 样式中的
background-position实际解析值，确认是否被简写属性（如background）意外覆盖
用 background 简写时哪些顺序不能错？
给 td 写 background 简写时，background-repeat 的位置直接影响是否平铺——它必须紧跟在 url() 后面，且不能被 background-size 或 background-position 隔开。
立即学习“前端免费学习笔记（深入）”；
- 正确：
background: url('stripe.png') repeat-x top left / auto;——repeat-x紧接路径后，斜杠前 - 错误：
background: url('stripe.png') top left repeat-x / auto;—— 浏览器会忽略repeat-x，回退为默认repeat - 多层背景时，每张图的重复方式必须一一对应：
background: url('a.png') repeat-x, url('b.png') no-repeat; - 一旦用了
/指定background-size，前面所有值（含重复方式）顺序必须严格按规范，否则解析失败
表格背景图真正难的不是写法，而是它嵌套在表格盒模型里，尺寸、边框、内边距、文字对齐全会影响最终呈现。哪怕代码完全正确，也可能因为某处 padding: 0 或 line-height: 1 把背景“压”没了。调试时先关掉所有其他样式，单独验证背景规则是否生效，再逐步叠加。
