HTML学习笔记【5】使用表格

来源：互联网发布：数据库查询软件密码编辑：程序博客网时间：2024/05/22 01:32

1. 创建表格

A. 表格的基本构成 table tr td

<table>

<tr>

<td>单元格内的文字</td>

</tr>

<tr>

<td>单元格内的文字</td>

</tr>

</table>

其中<table></table>标记分别表示表格的开始与结束，<tr></tr>分别表示行飞开始和结束<td><td>表示单元格的开始和结束

B.设置表格的标题 caption

<caption>表格的标题</caption>

一个<table>表格中只能有一个标题

C.表头 th

<table>

<tr>

。。。。

</tr>

<tr>

<td>单元格内的内容<td>

。。。。

</tr>

</table>

2. 表格的基本属性

A. 表格宽度widh <table width="表格宽度">

B. 表格高度 height <table height="表格长度">

C. 表格对齐方式align <table align="表格对其方式">

如：<table width="500" height="500" align="center">

3. 表格的边框

A. 表格边框宽度border <table border="表格边框宽度">

B. 表格边框颜色 bordercolor <table bordercolor="表格边框宽度">

C. 内框宽度 cellspacing <table cellspacing="内框宽度">

D. 表格内文字与边框间距 cellpadding <table cellpadding="表格内文字与边框间距">

如：<table width="500" height="500" align="center" border="5" bordercolor="#999999" cellspacing="5" cellpadding="10">

4. 表格背景

A. 表格背景颜色bgcolor <table bgcolor="表格背景颜色">

B. 表格背景图像 background <table bgcolor="表格背景图像地址">

如： <table bgcolor="#FF99FF" background="image/1.jpg">

5. 表格的行属性

A. 高度控制height <tr height="行的高度">

B. 边框颜色 bordercolor <tr bordercolor="边框颜色">

C. 行背景bgcolor background <tr bgcolor="行背景颜色" background="行背景图片">

D. 行文字的水平对齐方式align <tr align="行文字的水平对齐方式">

E. 行文字的垂直对齐方式 valign <tr align="行文字的垂直对齐方式">

6. 单元格属性

A. 单元格大小 width height <td width="单元格宽度" height="单元格高度">

B. 水平跨度 colspan <td colspan="跨度列数">

C. 垂直跨度 rowspan <td rowspan="跨度行数">

D. 对齐方式 align valign <td align="水平对齐方式" valign="垂直对齐方式">

其中垂直对齐方式有 top middlebottom 水平对齐方式有 left center right

E. 单元格的背景色 bgcolor <td bgcolor="背景颜色">

F. 单元格的边框颜色 bordercolor<td bordercolor"边框颜色">

G. 单元格的亮边框bordercolorlight<td bordercolorlight="亮边框的颜色">

H. 单元格的暗边框 bordercolordark <td bordercolordark="暗边框的颜色">

I. 单元格的背景图案 background <td background="背景图像地址">

7. 表格结构

A. 表格的表首标记<thead>

。。。。。。

</thead>

B.表格的表主体标记<tbody>

。。。。。。

</tbody>

C.表格的表尾标记<tfoot>

。。。。。。

</tfoot>