td是表格中标准数据单元格，必须严格嵌套于tr内，配合th、tbody等语义化结构使用，正确设置colspan/rowspan并保障可访问性。
td 标签就是标准单元格，但得用对地方
td 本身没有“定义标准单元格”的额外操作——它在 tr（表格行）内出现时，天然就是标准数据单元格。关键不是“怎么定义”，而是“怎么避免误用”。常见错误是把它丢在 table 下直接子级、或和 th 混用却不考虑语义。
正确结构必须严格嵌套：table → tbody（或 thead/tfoot）→ tr → td（或 th）。
- 如果漏掉
tr，浏览器会尝试自动修复，但 DOM 结构不可靠，CSS 选择器可能失效 - 把
td放在thead里不报错，但语义错误：表头该用th，否则屏幕阅读器无法识别标题关系 -
td默认无样式，看起来“没边框”不是它的问题，而是 CSS 没配border或border-collapse
td 的 colspan 和 rowspan 别乱设，否则表格结构会塌
这两个属性看似简单，但实际是表格可访问性和渲染稳定性的高危点。它们不改变 DOM 层级，只影响渲染占位，一旦计算错，后续所有列偏移都会错位。
-
colspan="2"表示该td占据当前行中 2 个纵向列位，但不会“删除”右侧的td；如果右侧还有td，就会被挤到第 3 列之后，导致列数对不上 -
rowspan更容易出问题：跨行合并时，下一行对应位置必须留空（即不放td），否则会被当成新单元格，破坏对齐 - 用开发者工具检查
table元素时，如果看到“ghost cells”（灰色虚线框），基本就是colspan/rowspan配平失败
td 里放块级元素没问题，但会影响表格默认布局行为
HTML5 允许在 td 中放 div、p、甚至 section，但表格的自动宽度分配机制（如 table-layout: auto）会优先按内容撑开，而不是按 CSS 设置的 width。
- 想让
td严格按百分比或像素宽显示？必须加table-layout: fixed到table上，否则子元素宽度设置常被忽略 -
td默认vertical-align: middle，但里面放了div又设了height和overflow: hidden，就可能出现截断却无提示 - 避免在
td里用float或绝对定位——表格单元格不是常规块容器，脱离文档流会导致高度塌陷或打印异常
td 的可访问性依赖父级 tr 和 table 的完整结构
单独一个 td 没有意义。屏幕阅读器靠 table 的行列关系推导数据上下文，缺了 caption、scope 或表头关联，读出来就是“单元格，内容：123”，完全不知道这是“2024年销量”还是“用户ID”。
- 没有
caption或aria-label的table，对视障用户等于无描述表格 - 如果用了
rowspan合并行表头，必须给对应th加scope="row"，否则td无法绑定到正确的行标题 - 动态生成表格时，JS 插入
td后忘记同步更新aria-describedby关联，会导致辅助技术丢失上下文
td，而是让每一层嵌套都承担明确语义、每处跨行跨列都有可验证的配平、每个单元格在不同设备和辅助工具中都保持可理解——这些细节藏在结构里，不在标签名上。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
