table标签用法

<table>标签

HTML中表格由 <table> 标签来定义。

每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。<td>标签中表示内容，即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等。

<table>标签的基本格式

<table>
            <tr>
                <th></th>
                <th></th>
            </tr>
            <tr>
                <td></td>
                <td></td>
            </tr>
        </table>

功能: <table>…</table>用来声明表格开始与结束.

        <tr>…</tr>用来设置表格的行.

       <th>…</th>用来设置标题栏位.

       <td>…</td>用来设置数据栏位.

<table>标签下的属性  

属性	属性值	说明
border	像素	表格边框宽度
height	像素、百分比	表格整体高度
width	像素、百分比	表格整体宽度
cellpadding	像素、百分比	边框与单元格的距离
cellspacing	像素、百分比	单元格边框宽度
align	Left、center、right	对齐方式
bgcolor	英文、16进制、rgba	表格背景颜色
background	url	表格的背景图片

 

<tr><th><td>标签下的常用属性

属性	属性值	说明
width	像素、百分比	设置单元格的宽
height	像素、百分比	设置单元格的高
align	Left、center、right	水平移动
valign	Top、middle、bottom	垂直移动
nowrap	无	在单元格中换行

 

 

 

 

 

 

 拆分与合并单元格

属性	属性值	说明
colspan	数字（占据的列数）	由左向右扩展
rowspan	数字（占据的行数）	由上向下扩展

注意：合并单元格时，需要删除所占用位置的代码

 

表格的结构化、标题

1.结构化格式：

<table>

    <thead>……</thead>    --------表头区

    <tbody>……</tbody>    --------表体区

      ………………

    <tfoot>……</tfoot>   --------表尾区

</table>

2.表格的标题（只能有一个）：

<table>

<caption>标题内容</caption>

</table>

<caption>标签下的属性值有:

属性名	属性值	说明
align	top	标题在表格上方
	bottom	标题在表格下方