HTML <tr> 标签
示例
一个包含三行的简单 HTML 表格;一行标题行和两行数据行
<table>
<tr>
<th>月份</th>
<th>储蓄</th>
</tr>
<tr>
<td>一月</td>
<td>$100</td>
</tr>
<tr>
<td>二月</td>
<td>$80</td>
</tr>
</table>
自己动手试一试 »
更多“自己尝试”的例子见下文。
定义和用法
<tr>
标签定义 HTML 表格中的一行。
<tr>
元素包含一个或多个 <th>
或 <td>
元素。
浏览器支持
元素 | |||||
---|---|---|---|---|---|
<tr> | 是 | 是 | 是 | 是 | 是 |
全局属性
<tr>
标签也支持 HTML 中的全局属性。
事件属性
<tr>
标签也支持 HTML 中的事件属性。
更多示例
示例
如何对 <tr> 中的内容进行对齐(使用 CSS)
<table style="width:100%">
<tr>
<th>月份</th>
<th>储蓄</th>
</tr>
<tr style="text-align:right">
<td>一月</td>
<td>$100</td>
</tr>
</table>
自己动手试一试 »
示例
如何为表格行添加背景颜色(使用 CSS)
<table>
<tr style="background-color:#FF0000">
<th>月份</th>
<th>储蓄</th>
</tr>
<tr>
<td>一月</td>
<td>$100</td>
</tr>
</table>
自己动手试一试 »
示例
如何对 <tr> 中的内容进行垂直对齐(使用 CSS)
<table style="height:200px">
<tr style="vertical-align:top">
<th>月份</th>
<th>储蓄</th>
</tr>
<tr style="vertical-align:bottom">
<td>一月</td>
<td>$100</td>
</tr>
</table>
自己动手试一试 »
示例
如何创建表头
<table>
<tr>
<th>姓名</th>
<th>电子邮件</th>
<th>电话</th>
</tr>
<tr>
<td>John Doe</td>
<td>john.doe@example.com</td>
<td>123-45-678</td>
</tr>
</table>
自己动手试一试 »
示例
如何创建带标题的表格
<table>
<caption>每月储蓄</caption>
<tr>
<th>月份</th>
<th>储蓄</th>
</tr>
<tr>
<td>一月</td>
<td>$100</td>
</tr>
<tr>
<td>二月</td>
<td>$80</td>
</tr>
</table>
自己动手试一试 »
示例
如何定义跨越多行或多列的表格单元格
<table>
<tr>
<th>姓名</th>
<th>电子邮件</th>
<th colspan="2">电话</th>
</tr>
<tr>
<td>John Doe</td>
<td>john.doe@example.com</td>
<td>123-45-678</td>
<td>212-00-546</td>
</tr>
</table>
自己动手试一试 »
相关页面
HTML 教程:HTML 表格
HTML DOM 参考:TableRow 对象
CSS 教程:表格样式
默认 CSS 设置
大多数浏览器会使用以下默认值显示 <tr>
元素
tr {
display: table-row;
vertical-align: inherit;
border-color: inherit;
}