<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

Leftcenterright

对齐方式

 bgcolor

英文、16进制、rgba

表格背景颜色

background

 url

表格的背景图片

 

 

 

 

 

 

 

 

 

 

 

 

 

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

属性

属性值

说明

width

像素、百分比

设置单元格的宽

height

像素、百分比

设置单元格的高

align

Leftcenterright

水平移动

valign

Topmiddle、bottom

垂直移动

 nowrap

在单元格中换行

 

 

 

 

 

 

查分合并单元格

属性

属性值

说明

colspan

数字(占据的列数)

由左向右扩展

rowspan

数字(占据的行数)

由上向下扩展

 

 

 

 

 

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

表格的结构化标题

1.结构化格式:

<table>

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

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

      ………………

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

</table>

 

2.表格的标题(只能有一个):

<table>

<caption>标题内容</caption>

</table>

 

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

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

 

 

 

 

 

posted on 2018-06-05 00:20  丁昆  阅读(3988)  评论(0编辑  收藏  举报