应使用CSS设置表格列宽，HTML的width属性已废弃；col元素配合width或min-width最兼容；colspan合并列需严格同步结构，避免错位。
HTML 表格列宽该用 width 属性还是 CSS？
别用 width 属性设列宽——HTML5 已废弃 <colgroup></colgroup> 和 <table> 的 <code>width 属性，主流浏览器虽能解析像素值（如 width="200"），但不支持百分比以外的相对单位，且行为不可靠。
真正稳定可控的方式是用 CSS：col 元素配合 width 或 min-width，或直接给 th/td 设样式。
-
<colgroup> <col style="width: 120px"> <col style="width: 20%"> </colgroup>是目前最兼容、语义最清晰的列宽控制方式 - 避免给
<table> 加 <code>width属性，它会干扰响应式布局，且在现代 CSS Grid/Flex 布局中完全失效 - 如果表格内容长度浮动大，优先用
min-width+table-layout: fixed，否则列宽会被长文本撑开，破坏设计预期 - 第一行
<th colspan="3">总标题</th>→ 这一行只能有这一个<th>，不能跟其他 <code><th> 并列，否则列数对不上 <li>第二行要填满三列，就得写三个 <code><td>；如果只写两个，表格会自动补空单元格，但边框/背景可能错乱 <li> <code>colspan="0"在所有浏览器中都无效，不要尝试用它“自动适应” -
<th colspan="2">姓名信息</th> <td>年龄</td>这一行共算 3 列，下一行也得凑够 3 列（比如两个<td> + 一个 <code><td>） <li>语义上，<code><th> 应用于表头区域，<code><td> 用于数据区；混用本身不报错，但会影响可访问性（屏幕阅读器依赖结构） <li>如果用 <code><thead> 包裹表头行，那里面所有单元格最好统一用 <code><th>，否则部分辅助技术可能忽略 <code>colspan语义为什么合并后列宽不按预期分配？
因为
colspan不改变列定义，只改变单元格占位——它不调整底层列宽，只是“视觉跨越”。真正决定宽度的是<col>、CSS 或内容自然宽度。- 即使
<col style="width:100px">存在，一个colspan="3"单元格也不会刚好是 300px；它会优先满足内容最小宽度，再按剩余空间分配 - 加
table-layout: fixed可强制按<col>宽度切分，但此时colspan单元格宽度 = 所跨各列宽度之和，若列宽没显式设，结果仍不可控 - 调试时打开浏览器开发者工具，看
Computed标签页里的width，别只信Styles面板里写的值
colspan没删对应单元格，或漏算某一行的列总数，都会导致渲染偏移——这种问题在嵌套表格或动态生成 HTML 时尤其隐蔽。 - 即使
colspan 怎么合并列才不会错位？
colspan 看似简单，但错一位就会整行塌陷——它不是“让这一格变宽”，而是“跳过后面 N−1 个单元格”。浏览器按从左到右、从上到下顺序渲染，合并后必须手动删掉被覆盖的单元格。
合并列时表头 <th> 和内容 <code><td> 能混用吗？
<p>能，但必须保证每行总列数一致。浏览器不关心你用的是 <code><th> 还是 <code><td>，只数 <code>colspan 和普通单元格数量之和。
立即学习“前端免费学习笔记（深入）”；
