HTML <td> 标签
<td> 标签定义 HTML 表格中的标准单元格。
HTML 表格有两类单元格:
- 表头单元 - 包含头部信息(由 th 元素创建)
- 标准单元 - 包含数据(由 td 元素创建)
td 元素中的文本一般显示为正常字体且左对齐。
1. 范例
一个简单的 HTML 表格,包含两行两列:
<table border="1"> <tr> <th>Month</th> <th>Savings</th> </tr> <tr> <td>January</td> <td>$100</td> </tr> </table>
2. 浏览器支持
元素 | Chrome | IE | Firefox | Safari | Opera |
---|---|---|---|---|---|
<td> | Yes | Yes | Yes | Yes | Yes |
所有浏览器都支持 <td> 标签。
3. HTML 与 XHTML 之间的差异
在 HTML 4.01 中,td 元素的 "bgcolor"、"height"、"width" 以及 "nowrap" 是不被赞成使用的。
在 XHTML 1.0 Strict DTD 中,td 元素的 "bgcolor"、"height"、"width" 以及 "nowrap" 是不被支持的。
4. 提示和注释
提示:请使用 colspan 和 rowspan 属性来实现内容横跨多个行或列。
5. 可选的属性
属性 | 值 | 描述 |
---|---|---|
abbr | text | 规定单元格中内容的缩写版本。 |
align |
|
规定单元格内容的水平对齐方式。 |
axis | category_name | 对单元进行分类。 |
bgcolor |
|
不赞成使用。请使用样式取而代之。 规定单元格的背景颜色。 |
char | character | 规定根据哪个字符来进行内容的对齐。 |
charoff | number | 规定对齐字符的偏移量。 |
colspan | number | 规定单元格可横跨的列数。 |
headers | header_cells'_id | 规定与单元格相关的表头。 |
height |
|
不赞成使用。请使用样式取而代之。 规定表格单元格的高度。 |
nowrap | nowrap |
不赞成使用。请使用样式取而代之。 规定单元格中的内容是否折行。 |
rowspan | number | 规定单元格可横跨的行数。 |
scope |
|
定义将表头数据与单元数据相关联的方法。 |
valign |
|
规定单元格内容的垂直排列方式。 |
width |
|
不赞成使用。请使用样式取而代之。 规定表格单元格的宽度。 |
6. 全局属性
<td> 标签支持 HTML 中的全局属性。
7. 事件属性
<td> 标签支持 HTML 中的事件属性。
8. TIY 范例
- 表格
这个例子演示如何在 HTML 文档中创建表格。 - 表格边框
本例演示各种类型的表格边框。 - 没有边框的表格
本例演示一个没有边框的表格。 - 表格中的标题(Headings)
本例演示如何显示表格标题。 - 空单元格
本例展示如何使用" "处理没有内容的单元格。 - 带有标题的表格
本例演示一个带标题(caption)的表格 - 跨行或跨列的表格单元格
本例演示如何定义跨行或跨列的表格单元格。 - 表格内的标签
本例演示如何显示在不同的元素内显示元素。 - 单元格填充(Cell padding)
本例演示如何使用单元格填充来创建单元格内容与其边框之间的空白。 - 单元格间距(Cell spacing)
本例演示如何使用单元格间距增加单元格之间的距离。 - 向表格添加背景颜色或背景图像
本例演示如何向表格添加背景 - 向表格单元添加背景颜色或者背景图像
本例演示如何向一个或者更多表格单元添加背景 - 在表格单元中排列内容
本例演示如何使用 "align" 属性排列单元格内容,以便创建一个美观的表格。 - 框架(frame)属性
本例演示如何使用 "frame" 属性来控制围绕表格的边框。
HTML <template> 标签:<template> 标记用作容纳页面加载时对用户隐藏的 HTML 内容的容器。<template> 中的内容可以稍后使用 JavaScript 呈现。