HTML <td> 标签

实例

一个简单的HTML表,包含两个表格单元格:

<table id="customers">
<tbody>
<tr>
<th>ID</th>
<th>公司</th>
<th>类型</th>
</tr>
<tr>
<td>4</td>
<td>小米</td>
<td>手机</td>
</tr>
<tr>
<td>5</td>
<td>滴滴</td>
<td>出行</td>
</tr>
<tr>
<td>6</td>
<td>头条</td>
<td>新闻</td>
</tr>
</tbody>
</table>
运行 »

下面有更多"运行"的例子.


定义和用法

<td> 标签定义HTML表格中的标准单元格.

HTML表有两种单元格:

  • 标题单元格 - 包含标题信息(使用<th>元素创建)
  • 标准单元格 - 包含数据(使用 <td> 元素创建)

<th>元素中的文本默认为粗体并居中.

<td>元素中的文本是常规的,默认情况下是左对齐的.


浏览器支持

Element
<td> Yes Yes Yes Yes Yes

提示和注意事项

提示:使用 colspan 和 rowspan 属性让内容跨越多个列或行!



HTML 4.01和HTML5之间的差异

HTML5中删除了所有布局属性.


属性

属性 描述
abbr text HTML5不支持.
定义单元格中内容的缩写版本
align left
right
center
justify
char
HTML5不支持.
定义单元格内容的水平对齐方式
axis category_name HTML5不支持.
对单元格进行分类
bgcolor rgb(x,x,x)
#xxxxxx
colorname
HTML5不支持.
定义单元格的背景颜色
char character HTML5不支持.
定义根据哪个字符来进行内容的对齐
charoff number   HTML5不支持.
定义对齐字符的偏移量
colspan number 定义单元格可横跨的列数
headers header_id 定义与单元格相关联的一个或多个表头单元格
height pixels
%
HTML5不支持.
设置单元格的高度
nowrap nowrap HTML5不支持.
定义单元格中的内容是否折行
rowspan number 设置单元格可横跨的行数
scope col
colgroup
row
rowgroup
HTML5不支持.
定义将表头单元格与数据单元格相关联的方法
valign top
middle
bottom
baseline
HTML5不支持.
定义单元格内容的垂直排列方式
width pixels
%
HTML5不支持.
定义单元格的宽度

全局属性

<td> 标记还支持HTML中的 全局属性 .


事件属性

<td> 标记还支持HTML中的 事件属性 .


相关页面

HTML教程: HTML表格

HTML DOM参考: TableData对象

CSS教程: table样式


默认CSS设置

大多数浏览器将使用以下默认值显示 <td> 元素:

td {
    display: table-cell;
    vertical-align: inherit;
}