旧版ie（ie6–ie8）表格渲染稳定但css兼容性差：border-collapse需触发haslayout，vertical-align需配合line-height/height，col宽度需设td/th，块级元素需zoom:1。应优先用html属性而非css控制表格。
旧版 IE（IE6–IE8）对 HTML 表格的原生支持其实比很多新特性更稳定，但实际项目中仍常因 CSS 渲染差异、边框折叠、单元格垂直对齐、colgroup/col 行为不一致等问题导致布局错乱——不是表格“不能用”，而是“用得不一致”。
IE6–IE8 中 border-collapse: collapse 失效或表现异常
现代浏览器中 border-collapse: collapse 能让相邻边框合并，但在 IE6–IE7 下常表现为双线边框或部分边框消失；IE8 开始支持，但需触发 hasLayout 才能正确渲染。
- 必须显式给
table设置zoom: 1或position: relative触发 hasLayout，否则边框可能重叠或错位 - 避免混用
border-collapse: collapse和border-spacing：IE6–IE7 完全忽略border-spacing，设了也无效 - 若使用
cellspacing="0"属性（HTML 属性），它在 IE6–IE8 中比 CSS 更可靠，建议保留并配合 CSS 双保险 - 替代方案：改用
border-collapse: separate+border-spacing: 0，并在 IE6–IE7 中用*border-collapse: expression(this.runtimeStyle.borderCollapse='separate')（仅限 IE6–IE7 条件注释内）
vertical-align 在 IE6–IE7 中对 td 不生效
写 td { vertical-align: middle; } 在 IE6–IE7 中常被忽略，尤其当单元格内含行内元素或空格时，文字会默认顶对齐。
- 必须同时设置
td的line-height与height，且二者相等才能实现居中（例如height: 40px; line-height: 40px;） - 避免依赖
vertical-align: middle单独生效；若内容是单行文本，优先用line-height方案 - 若内容多行或含块级元素，改用嵌套
div+display: table-cell（IE8+ 支持），但 IE6–IE7 需 fallback 到绝对定位模拟居中
colgroup 和 col 在 IE6–IE7 中宽度失效
<col width="200"> 或 <col style="width: 200px;"> 在 IE6–IE7 中常被忽略，列宽由内容撑开，无法强制约束。
- 必须给对应
td或th显式设置width（推荐用像素值，百分比在 IE6 中计算不稳定） - 不要只靠
col控制样式（如背景色、边框）：IE6–IE7 中col上的 CSS 几乎不生效，应写到td/th上 - 若需响应式列宽，IE6–IE7 下放弃
col，改用 JS 动态遍历tr:first-child > th, tr:first-child > td并设置style.width
IE6–IE7 表格内 display: block 元素换行异常
在 td 内放 div 并设 display: block，IE6–IE7 常将其撑出单元格外或破坏表格流，尤其当 div 含 float 或 position: absolute 时。
- 所有
td内的块级容器必须设zoom: 1（触发 hasLayout），否则浮动子元素无法正确包含 - 避免在
td内用float布局；如需多栏，改用嵌套表格（table套table），IE6 对此兼容性远好于 CSS 浮动 - 若必须用
position: absolute，父td必须设position: relative，且 IE6 需额外加*html td { position: relative; }（条件注释或 hack）
真正麻烦的不是表格本身，而是你试图用现代 CSS 手段去“增强”它——旧版 IE 的表格渲染引擎和 CSS 引擎是两套独立逻辑，强行统一反而更容易崩。最稳的做法是：该用 HTML 属性就用属性（cellpadding、cellspacing、width），该设内联样式就设内联样式，把 CSS 当补丁，而不是主控逻辑。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
