<table>表格标签

来源：互联网发布：淘宝主图尺寸750 编辑：程序博客网时间：2024/05/24 05:01

<table>表格标签

表格使用到的标签：

<table>

<tr> 元素定义表格行；

<th> 元素定义表头，默认居中加粗；一般对表格的第一行或者第一列进行格式化，就是粗体显示。并不常用

<td> 元素定义表格单元。

<caption></caption>表格标题。caption 标签必须紧随 table 标签之后。您只能对每个表格定义一个标题。通常这个标题会被居中于表格之上。

表格常用的属性：

border规定表格边框的宽度。

bordercolor边框颜色

width规定表格的宽度。

height规定表格的高度。

align不赞成使用。请使用样式代替。规定表格相对周围元素的对齐方式。

colspan设置单元格占据指定的列数。

rowspan设置单元格占据指定的行数。
nowrap 属性规定表格单元格中的内容不换行。

每个表格可以有一个表头、一个表尾和一个或多个表体（即正文），分别以THEAD、TFOOT和TBODY元素表示。

<thead> 表头可以没有thead
<tbody> 表体一个表格至少要存在一个tbody，也可以存在多个。（即使不写，浏览器也会自动添加一个）
<tfoot> 表尾可以没有tfoot

TBODY作用是：可以控制表格分行下载，从而提高下载速度。（网页的打开是先表格的的内容全部下载完毕后，才显示出来，分行下载可以先显示部分内容，这样会减少用户等待时间。）

使用TBODY的目的是可以使得这些包含在内的代码不用在整个表格都解析后一起显示，就是说如果有多个行，那么如果得到一个TBODY行，就可以先显示一行。TBODY这个标签可以控制表格分行下载，当表格内容很大时比较实用，在需要分行下载处加上<tbody>和</tbody>。

表格组成部分如下图所示：

案例Demo：

<!DOCTYPE >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>表格标签</title>
</head>
<!--
<table>表格标签
表格使用到的标签：
<table>
<tr>元素定义表格行；
<th>元素定义表头，默认居中加粗；
<td>元素定义表格单元。
<caption></caption>表格标题。caption 标签必须紧随 table 标签之后。您只能对每个表格定义一个标题。通常这个标题会被居中于表格之上。
表格常用的属性：
border规定表格边框的宽度。
bordercolor边框颜色
width规定表格的宽度。
height规定表格的高度。
align不赞成使用。请使用样式代替。规定表格相对周围元素的对齐方式。
colspan设置单元格占据指定的列数。
rowspan设置单元格占据指定的行数。
-->
<body>
<table border="2" height="200px" width="400px" bordercolor="#FF0000"  align="center">
<caption>月份收入</caption>
<tbody>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr align="center">
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$500</td>
</tr>
<tr>
<td colspan="2">March</td>
</tr>
<tr>
<td rowspan="2">April</td>
<td>$220</td>
</tr>
<tr>
<td>$500</td>
</tr>
</tbody>
</table>
</body>
</html>

效果如下图所示：

nowrap 属性规定表格单元格中的内容不换行。

0 0