bgcolor属性在现代浏览器中完全无效，应使用CSS的background-color设置表格背景；tbody或thead是最稳妥的选择，可避免td/th覆盖和border-spacing干扰。
bgcolor 属性在现代浏览器中完全无效，别再试了。直接写 bgcolor="red" 不会报错，但也不会变色——Chrome、Firefox、Edge 都会静默忽略它。
为什么 table 上的 background-color 看不见
不是代码写错了，是渲染顺序导致的：浏览器默认把 td 和 th 当作「前景层」，哪怕它们没设背景，实际也等效于 background-color: transparent，会挡住 table 的背景色。常见现象包括：
- 开发者工具里样式没被划掉，但页面就是白底
- 只在单元格间隙（
border-spacing）里看到一点点颜色 - 加了
border-collapse: collapse后，整个表格背景彻底消失
验证方法：临时加一条 CSS：td, th { background-color: transparent !important; }，如果这时背景突然出来了，就确认是子元素覆盖问题。
真正生效的背景设置位置
想让背景色稳定显示，得选对目标元素。按优先级推荐：
立即学习“前端免费学习笔记（深入）”；
-
tbody或thead：块级容器，背景铺满整块内容区，不受border-spacing干扰，最稳妥 -
tr：适合隔行变色（如tr:nth-child(even)），但注意它不覆盖边框间隙 -
td/th：最细粒度控制，适合高亮单个单元格，但设多了容易覆盖上级背景
例如，给整张表加浅蓝底色，用这个更可靠：
<table style="border-spacing: 0;">
<tbody style="background-color: #e8f4ff;">
<tr><td>A</td><td>B</td></tr>
</tbody>
</table>
内联 style vs class：维护性差异很大
直接写 <td style="background-color: #ffeb3b;"> 虽快，但一改全改，且极易被其他 CSS 打断（比如某个 UI 框架自带的 <code>table td { background: white; }）。
- 推荐统一用 class：
<table class="data-table">，然后在 CSS 中定义 <code>.data-table tbody { background-color: #f9f9f9; } - 需要动态切换？用 JS 操作 class：
tableEl.classList.toggle('dark-bg')，比反复改style.backgroundColor更稳定 - 如果必须用内联，记得加
!important是样式冲突失控的信号，不该是常规方案
最容易被忽略的一点：你眼睛看到的「表格背景」，大概率不是 table 的，而是 tbody 或某一层 tr 的。打开开发者工具，挨个点，看哪一层的 background-color 实际在起作用——别猜，要看渲染树。
