问td 是何意 HTML 表格单元格标签

td 最常见含义是 HTML 里面的表格数据单元格标签，英文全称 table data，它是网页表格结构里用来存放单格数据的核心标签，我们在网页上看到的成绩表 数据表 报价表，每一个方格里面的内容，大多都是由 td 标签承载，它需要搭配 tr 行标签和 table 表格容器一起使用，tr 代表表格的一整行，每一行内部可以放置多个 td，一个 td 就对应一行当中的一格，它和表头标签 th 有明确区分，th 专门做表头标题，默认加粗居中，td 是普通数据格，默认文字常规样式左对齐，除了 HTML 场景之外，td 在其他行业也有别的缩写含义，比如工程领域的扭矩单位 td，通信领域的相关缩写，但是普通编程学习场景下，提到 td 基本都是指这个 HTML 单元格标签。

底层运行原理

HTML 表格属于嵌套层级结构，最外层 table 定义整个表格区域，table 内部写入 tr 代表一行，tr 标签内部放置若干 td 标签，浏览器解析页面源码的时候，会识别这套嵌套结构，自动绘制表格边框 网格，把每个 td 内部的内容填充进对应的方格，td 属于双标签，必须同时写开始标签和闭合标签，不能只写单边标签，td 内部属于内容容器，可以嵌套文字 超链接 图片 输入框 按钮 列表等其他 HTML 元素，没有严格限制内部内容类型，当同一行里面 td 的数量和其他行不一致，表格网格就会错乱，所以编写的时候要保持每行单元格数量统一，除非使用合并单元格属性。

常用属性详细说明

补充说明，width height align valign 这些属于 HTML 原生旧属性，在现在 W3C 新标准当中已经不推荐继续使用，现代前端开发优先使用 CSS 样式控制单元格尺寸和对齐，原生属性只在老旧网页源码里面大量留存。

基础编写步骤

第一步 新建 html 页面，写入 table 标签作为表格外层容器

第二步 在 table 内部添加 tr 标签，代表表格第一行

第三步 在 tr 标签内部添加多个 td 标签，在 td 里面填入需要展示的数据

第四步 继续新增 tr 标签，编写第二行以及后续所有行的 td 单元格

第五步 如果需要合并方格，给对应的 td 增加 colspan 或者 rowspan 属性，填写对应的跨列跨行数字

第六步 保存页面文件，使用浏览器打开，查看 td 渲染出来的表格效果

第七步 如果需要调整外观，编写 CSS 样式，修改 td 的背景色 边框 内边距 字体等样式

td 和 th 核心差异对比

现代前端开发注意要点

早年网页开发曾经使用 table 加 td 完成整页布局，这种方式现在已经淘汰，原因是代码冗余，响应式适配困难，移动端很容易出现横向溢出，现在 table 搭配 td 只推荐用来展示结构化报表数据，比如订单清单 统计表格 课程表，td 内部文字如果过长，单元格会自动撑开表格，需要配合 CSS 的 word-break 换行或者 overflow 溢出隐藏来处理，同时 td 可以通过 CSS 设置 padding 内边距，调整文字和方格边框之间的距离，提升表格可读性。

其他领域 td 缩写补充

除 HTML 标签之外，td 还有其他行业缩写含义，在自动化和机械领域 td 可以指代扭矩相关参数，在时间相关场景 td 也可以表示今日缩写，但是这类场景属于小众用法，编程学习者搜索 td，绝大多数目标都是 HTML 的 td 单元格标签。

【常见问题】

问题 1，td 标签能不能脱离 tr 单独写

回答 1，td 标签不能脱离 tr 单独写，td 必须放置在 tr 行标签内部，tr 又必须放在 table 容器里面，如果单独书写 td，浏览器不会按照表格单元格正常渲染，属于不规范错误写法。

问题 2，td 纵向合并单元格使用哪个属性

回答 2，td 纵向合并单元格使用 rowspan 属性，属性数值填写需要跨越的行数，比如 rowspan 等于 3，就代表当前 td 纵向占据三行方格位置。

问题 3，td 标签里面可以放置图片吗

回答 3，td 标签内部可以放置 img 图片标签，还可以嵌套链接 表单控件等其他 HTML 元素，td 本身只是单元格容器，支持多种类型内容嵌套。

问题 4，td 和 th 可以互换使用吗

回答 4，td 和 th 渲染出来都是方格，但是语义不一样，普通数据单元格建议使用 td，表头标题建议使用 th，保持语义规范，方便无障碍阅读器识别表格结构。

【免责申明】

本文内容基于 HTML 标准相关知识进行讲解，不同版本浏览器对 table 原生旧属性兼容表现会有差别，现代前端规范持续更新，实际项目开发请参考最新标准以及项目兼容要求，本文仅作为学习参考，不构成强制开发规范。