HTML教程-HTML<td>标签

HTML <td> 标签用于指定 HTML 表格中包含表格数据的单元格。<td> 标签必须是 <tr>（表格行）标签的子元素。每个表格行可以包含多个 <td> 数据元素。

<tr> 标签中的分组的 <td> 元素在表格中呈现为一行。<td> 元素的内容默认为常规文本，左对齐。

语法

<td>...</td>

以下是 HTML <td> 标签的一些规范：

显示	内联
开始标签/结束标签	开始标签和结束标签都有
用法	表格内容

示例

<!DOCTYPE html>
<html>
<head>
  <title>HTML td 标签</title>
  <style>
    th {
      background-color: #6495ed;
    }
    th, td {
      border: 1px solid black;
      padding: 10px;
    }
  </style>
</head>
<body>
  <h2>td 标签示例</h2>
  <table style="border-collapse: collapse; background-color: #dcdcdc;">
    <tr>
      <th>Product</th>
      <th>Quantity</th>
      <th>Price</th>
    </tr>
    <tr>
      <td>Books</td>
      <td>5</td>
      <td>589</td>
    </tr>
    <tr>
      <td>T-shirt</td>
      <td>5</td>
      <td>3500</td>
    </tr>
    <tr>
      <td>Jeans</td>
      <td>2</td>
      <td>5000</td>
    </tr>
  </table>
</body>
</html>

使用 `<td>` 标签固定列宽度的表格

在 HTML 表格中，浏览器会自动调整行和列的尺寸，以适应内容。然而，有时需要固定列的宽度，使其相等。有多种技术可用于固定列的宽度。

使用 <td> 标签的 width 属性固定列宽度： <td> 标签的 width 属性用于固定特定列的宽度。我们可以为该属性分配一个数值或百分比值。

使用 `<col>` 标签固定列宽度的表格

<col> 标签： 在表格中，<col> 标签用于固定特定列的宽度。我们可以为该属性分配一个数值或百分比值。

属性：

标签特定属性：

HTML <td> 标签支持以下标签特定属性：

属性	值	描述
abbr	文本	定义单元格内容的缩写版本。(在 HTML5 中不支持)
align	left right center justify char	指定单元格内容的水平对齐方式。(在 HTML5 中不支持)
axis	category_name	对单元格进行分类。(在 HTML5 中不支持)
bgcolor	rgb(x,x,x) #xxxxxx Color_name	设置单元格的背景颜色。(在 HTML5 中不支持)
char	character	指定单元格内容相对于字符的对齐方式。(在 HTML5 中不支持)
charoff	数字	确定内容相对于 char 属性指定的字符对齐的字符数。(在 HTML5 中不支持)
colspan	数字	确定单元格应跨越的列数。
headers	header_id	确定与单元格相关联的一个或多个标题单元格。
height	% 像素	确定表格单元格的高度。(在 HTML5 中不支持)
nowrap	nowrap	如果设置，则单元格内的内容不换行。(在 HTML5 中不支持)
rowspan	数字	确定单元格应跨越的行数。
scope	col colgroup row rowgroup	指定标题元素所关联的单元格。(在 HTML5 中不支持)
valign	top middle bottom baseline	确定单元格内容的垂直对齐方式。(在 HTML5 中不支持)
width	% 像素	确定单元格的宽度。(在 HTML5 中不支持)

全局属性：

HTML <td> 标签支持 HTML 中的全局属性。

事件属性：

HTML <td> 标签支持 HTML 中的事件属性。

支持的浏览器

元素	Chrome	IE	Firefox	Opera	Safari
`<td>`	是	是	是	是	是

HTML教程-HTML<td>标签

语法

示例

使用 `<td>` 标签固定列宽度的表格

使用 `<col>` 标签固定列宽度的表格