<table> | HTML表格标签的定义与用法

由 hcduguo

定义与用法

  • <table> 标签定义 HTML 表格
  • 一个 HTML 表格包括 <table> 元素，一个或多个 <tr>、<th> 以及 <td> 元素。
  • <tr> 元素定义表格行，<th> 元素定义表头，<td> 元素定义表格单元。
  • 更复杂的 HTML 表格也可能包括 <caption>、<col>、<colgroup>、<thead>、<tfoot> 以及 <tbody> 元素。

提示：<table>系列元素用于管理页面的布局，例如页眉部分，导航栏，正文内容，页脚部分等。但是我们建议在表格上使用div标签来管理页面的布局。

HTML表格标签
标签描述
<table>它定义了一个表。
<tr>它在表中定义一行。
<th>它在表中定义标题单元格。
<td>它在表中定义一个单元格。
<caption>它定义了表格标题。
<colgroup>它在表中指定一组一个或多个列以进行格式化。
<col>它与<colgroup>元素一起使用以指定每个列的列属性。
<tbody>用于将表中的正文内容分组。
<thead>用于将表中的标题内容分组。
<tfooter>用于将表中的页脚内容分组。

语法格式

<table> ……</table>  

示例代码

<table>  
<tr><th>ID</th><th>姓名</th><th>分数</th></tr>  
<tr><td>1</td><td>杜甫</td><td>60</td></tr>  
<tr><td>2</td><td>李白</td><td>80</td></tr>  
<tr><td>3</td><td>白居易</td><td>82</td></tr>  
<tr><td>4</td><td>苏轼</td><td>72</td></tr>  
</table>

效果展示：

ID姓名分数
1杜甫60
2李白80
3白居易82
4苏轼72

HTML 4.01 与 HTML5差异

在 HTML5 中，仅支持 “border” 属性，并且只允许使用值 “1” 或 “”。

浏览器支持

所有主流浏览器都支持 <table> 标签。

标签属性

属性值描述
alignleft
center
right		HTML5 不支持。HTML 4.01 已废弃。 规定表格相对周围元素的对齐方式。
bgcolorrgb(x,x,x)
#xxxxxx
colorname		HTML5 不支持。HTML 4.01 已废弃。 规定表格的背景颜色。
border1
“”		规定表格单元是否拥有边框。
cellpaddingpixelsHTML5 不支持。规定单元边沿与其内容之间的空白。
cellspacingpixelsHTML5 不支持。规定单元格之间的空白。
framevoid
above
below
hsides
lhs
rhs
vsides
box
border		HTML5 不支持。规定外侧边框的哪个部分是可见的。
rulesnone
groups
rows
cols
all		HTML5 不支持。规定内侧边框的哪个部分是可见的。
summarytextHTML5 不支持。规定表格的摘要。
widthpixels
%		HTML5 不支持。规定表格的宽度。

全局属性

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

事件属性

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

相关